| | |
| | | top: "25%", |
| | | right: "5%", |
| | | itemGap: 5, //块之间的间距 |
| | | itemHeight: 5, // 设置图例项的高度 |
| | | itemHeight: 8, // 设置图例项的高度 |
| | | itemWidth: 5, // 设置图例项的宽度 |
| | | data: ["生产", "完成", "待机", "警告", "故障"], |
| | | textStyle: { |
| | |
| | | // radius: ["20%", "30%"], |
| | | // center: ["33%", "50%"], |
| | | radius: ["20%", "30%"], |
| | | center: ["33%", "50%"], |
| | | center: ["38%", "50%"], |
| | | avoidLabelOverlap: false, |
| | | // left: "-30%", |
| | | // top: "10%", |
| | |
| | | this.option = { |
| | | legend: { |
| | | orient: "vertical", |
| | | bottom: '30%', |
| | | right: '6%', |
| | | bottom: "30%", |
| | | right: "6%", |
| | | textStyle:{ |
| | | color:'#fff' |
| | | color: "#fff", |
| | | }, |
| | | itemHeight: 5, // 设置图例项的高度 |
| | | itemWidth: 5, // 设置图例项的宽度 |
| | |
| | | color: "#01afba", |
| | | }, |
| | | }, |
| | | |
| | | ], |
| | | }, |
| | | radar: { |
| | | // center:['43%','55%'], |
| | | center: ["33%", "50%"], |
| | | // radius:'65%', |
| | | radius:'30%', |
| | | center: ["40%", "50%"], // 更改为更小的百分比以往中间移动 |
| | | radius: "30%", |
| | | indicator: [ |
| | | { name: "人", max: 100, color: "#fff" }, |
| | | { name: "环", max: 100, color: "#fff" }, |
| | |
| | | show: false, |
| | | }, |
| | | axisName:{ |
| | | padding:-10 |
| | | } |
| | | padding: -10, |
| | | }, |
| | | |
| | | // splitArea:{ |
| | | // areaStyle:{ |
| | |
| | | ], |
| | | }; |
| | | this.myChart.setOption(this.option); |
| | | const that=this |
| | | window.addEventListener('resize',()=>{ |
| | | const that = this; |
| | | window.addEventListener("resize", () => { |
| | | that.myChart.resize(); |
| | | }) |
| | | }); |
| | | // this.defineEvent(); |
| | | // this.selectPie(); |
| | | // timer = setInterval(this.selectPie, 1500); |
| | |
| | | type: "highlight", |
| | | seriesIndex: 0, |
| | | dataIndex: this.currentIndex, |
| | | }) |
| | | }); |
| | | }, |
| | | |
| | | // 鼠标触摸轮播悬停事件 |
| | |
| | | |
| | | <style> |
| | | #echarts2 { |
| | | margin-top: .1rem; |
| | | width: 2.89rem; |
| | | height: 2.6rem; |
| | | height: 2.5rem; |
| | | transform: scaleY(2); |
| | | |
| | | /* |
| | | margin-top: .4rem; |
| | | width: 2.89rem; |
| | | height: 2.0rem; |
| | | transform: scaleY(2); */ |
| | | /* border: 1px solid red; */ |
| | | } |
| | | </style> |
| | |
| | | name: "Access From", |
| | | type: "pie", |
| | | // radius: ["25%", "40%"], |
| | | radius: ["33%", "40%"],//环变细 |
| | | radius: ["30%", "37%"],//环变细 |
| | | center: ["26%", "47%"], |
| | | avoidLabelOverlap: false, |
| | | label: { |
| | |
| | | name: "Access From", |
| | | type: "pie", |
| | | // radius: ["25%", "40%"], |
| | | radius: ["33%", "40%"],//环变细 |
| | | radius: ["30%", "37%"],//环变细 |
| | | center: ["74%", "47%"], |
| | | avoidLabelOverlap: false, |
| | | label: { |
| | |
| | | grid: { |
| | | left: 33, |
| | | right: 33, |
| | | top: 20, |
| | | top: 55, |
| | | bottom:5, |
| | | }, |
| | | yAxis: { |