12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <template>
- <div id="box1" style="width:100%;height:100%;"></div>
- </template>
- <script>
- import echarts from "echarts";
- export default {
- data() {
- return {};
- },
- props: ["tindoorFillRate"],
- mounted() {
- this.pie(this.tindoorFillRate || 0, "#box1", ["#0091FF", "#E1F2FF"]);
- },
- methods: {
- pie(pieData, box, colors) {
- const that = this;
- const myChart = echarts.init(document.querySelector(box));
- const data = pieData;
- const option = {
- grid: {
- top: 5,
- bottom: 5
- },
- color: colors,
- series: [
- {
- name: "valueOfMarket",
- type: "pie",
- center: ["50%", "50%"],
- radius: ["60%", "70%"],
- avoidLabelOverlap: false,
- hoverAnimation: false,
- label: {
- normal: {
- show: true,
- position: "center",
- color: "#000000",
- fontSize: 20,
- lineHeight: 0,
- formatter: "{b}\n{c}%"
- }
- },
- data: [
- {
- value: data,
- label: {
- normal: {
- show: true
- }
- }
- },
- {
- value: 100 - data,
- name: "",
- label: {
- normal: {
- show: false
- }
- }
- }
- ]
- }
- ]
- };
- myChart.setOption(option);
- }
- }
- };
- </script>
|