diff --git a/src/components/BottomBar/FaultType/index.jsx b/src/components/BottomBar/FaultType/index.jsx index 9fdc1a7..e1b9463 100644 --- a/src/components/BottomBar/FaultType/index.jsx +++ b/src/components/BottomBar/FaultType/index.jsx @@ -7,6 +7,88 @@ import { randomInt } from '../../../utils'; import { useState } from 'react'; function FaultType(props) { + const options = { + // tooltip: { + // trigger: 'item', + // }, + colors: [ + '#2760FF', + '#5B9BFF', + '#FFD160', + '#8167F6', + '#99D66C', + '#FF8A40', + '#12FFF5', + ], + grid: { + left: 0, + top: 0, + bottom: 0, + right: 0, + }, + legend: { + icon: 'circle', + top: 32, + right: 0, + bottom: 32, + width: 296, + height: 130, + itemGap: 30, + formatter: function (name) { + // console.log('name o', name, options.series[0].data.find(o => o.name == name).value) + return `${name} {sub|${ + options.series[0].data.find((o) => o.name == name).value + }}`; + }, + textStyle: { + color: '#DFF1FE', + fontSize: 18, + rich: { + sub: { + color: '#fff9', + fontSize: 18, + }, + }, + }, + }, + series: [ + { + type: 'pie', + center: ['26%', '54%'], + radius: ['55%', '75%'], + avoidLabelOverlap: false, + label: { + show: true, + formatter: '{d}%', + fontSize: 14, + color: 'inherit', + }, + labelLine: { + length: 0, + }, + // emphasis: { + // label: { + // show: true, + // fontSize: 40, + // fontWeight: 'bold', + // }, + // }, + // labelLine: { + // show: false, + // }, + data: [ + { value: 1048, name: '缺陷1' }, + { value: 735, name: '缺陷2' }, + { value: 580, name: '缺陷3' }, + { value: 484, name: '缺陷4' }, + { value: 300, name: '缺陷5' }, + { value: 300, name: '缺陷6' }, + { value: 300, name: '缺陷8' }, + ], + }, + ], + }; + const [lines, setLines] = useState([ { id: 1, label: '产线1', value: 'l1' }, { id: 2, label: '产线2', value: 'l2' }, @@ -39,7 +121,7 @@ function FaultType(props) {
- {/* */} +
);