96 lines
2.4 KiB
TypeScript
96 lines
2.4 KiB
TypeScript
// 步数
|
|
import {visibleChartLabel} from "/@/utils/utils.ts";
|
|
|
|
export function screenPie(chartData, total, color, formatter) {
|
|
return {
|
|
color: color,
|
|
tooltip: {
|
|
trigger: 'item',
|
|
show: true,
|
|
textStyle: {
|
|
color: '#fff',
|
|
},
|
|
backgroundColor: 'rgba(50,50,50,0.7)',
|
|
borderColor: '#1b7ef2',
|
|
},
|
|
legend: {
|
|
left: '72%',
|
|
top: 'center',
|
|
orient: 'vertical',
|
|
icon: 'circle',
|
|
itemGap: 8,
|
|
textStyle: {
|
|
color: '#ffffff',
|
|
fontSize: 16,
|
|
},
|
|
},
|
|
series: [
|
|
{
|
|
type: 'pie',
|
|
radius: ['50%', '76%'],
|
|
center: ['40%', '49%'],
|
|
avoidLabelOverlap: false,
|
|
label: {
|
|
show: true,
|
|
position: 'outside',
|
|
color: '#ffffff',
|
|
fontSize: 14,
|
|
},
|
|
labelLine: {
|
|
show: true,
|
|
length: 6,
|
|
length2: 10,
|
|
minTurnAngle: 120,
|
|
},
|
|
data: chartData,
|
|
},
|
|
],
|
|
};
|
|
}
|
|
|
|
//左侧圆
|
|
export function circleRing(chartData, total, color) {
|
|
const data = visibleChartLabel(chartData)
|
|
return {
|
|
color: color,
|
|
tooltip: {
|
|
trigger: 'item',
|
|
show: true,
|
|
textStyle: {
|
|
color: '#fff',
|
|
},
|
|
backgroundColor: 'rgba(50,50,50,0.7)',
|
|
borderColor: '#1b7ef2',
|
|
},
|
|
legend: {
|
|
left: '74%',
|
|
top: 'center',
|
|
orient: 'vertical',
|
|
icon: 'circle',
|
|
itemGap: 16,
|
|
textStyle: {
|
|
color: '#ffffff',
|
|
fontSize: 16,
|
|
},
|
|
},
|
|
series: [
|
|
{
|
|
type: 'pie',
|
|
radius: ['50%', '82%'],
|
|
center: ['42%', '55%'],
|
|
avoidLabelOverlap: false,
|
|
label: {
|
|
show: true,
|
|
position: 'inner',
|
|
formatter: '{d}%',
|
|
color: '#ffffff',
|
|
fontSize: 14,
|
|
},
|
|
labelLine: {
|
|
show: false,
|
|
},
|
|
data: data,
|
|
},
|
|
],
|
|
};
|
|
} |