Version
5.2.2
Link to Minimal Reproduction
https://echarts.apache.org/examples/zh/editor.html?c=gauge-ring
Steps to Reproduce
url: https://echarts.apache.org/examples/zh/editor.html?c=gauge-ring
option:
const gaugeData = [
{
value: 20,
name: 'Perfect',
title: {
offsetCenter: ['0%', '-30%']
},
detail: {
valueAnimation: true,
offsetCenter: ['0%', '-20%']
}
},
{
value: 40,
name: 'Good',
title: {
offsetCenter: ['0%', '0%']
},
detail: {
valueAnimation: true,
offsetCenter: ['0%', '10%']
}
},
{
value: 60,
name: 'Commonly',
title: {
offsetCenter: ['0%', '30%']
},
detail: {
valueAnimation: true,
offsetCenter: ['0%', '40%']
}
}
];
option = {
series: [
{
type: 'gauge',
startAngle: 90,
endAngle: -270,
pointer: {
show: false
},
progress: {
show: true,
overlap: false,
roundCap: true,
clip: false,
itemStyle: {
borderWidth: 1,
borderColor: '#464646'
}
},
axisLine: {
lineStyle: {
width: 10
}
},
splitLine: {
show: false,
distance: 0,
length: 10
},
axisTick: {
show: false
},
axisLabel: {
show: false,
distance: 50
},
data: gaugeData,
title: {
fontSize: 14
},
detail: {
width: 50,
height: 14,
fontSize: 14,
color: 'auto',
borderColor: 'auto',
borderRadius: 20,
borderWidth: 1,
formatter: '{value}%'
}
}
]
};
Current Behavior
会有虚线显示
Expected Behavior
不显示虚线
Environment
- OS:win10
- Browser: chrome 96.0.4664.110
- Framework:
Any additional comments?
const gaugeData = [
{
value: 30,
name: '内存资源',
title: {
offsetCenter: ['0%', '-18%'] // 第一个参数是X轴的位移,第二个参数是Y轴的位移, 负值是上(左)偏移,正值是下(右)偏移
},
detail: {
valueAnimation: true,
offsetCenter: ['0%', '-35%']
}
},
{
value: 60,
name: 'cores资源',
title: {
offsetCenter: ['0%', '35%']
},
detail: {
valueAnimation: true,
offsetCenter: ['0%', '18%']
}
}
];
option = {
color: ['#2C69FF', '#50BD6F'], // 设置圆环的颜色
series: [
{
type: 'gauge',
startAngle: 90,
endAngle: -270,
pointer: {
show: false
},
progress: {
show: true,
overlap: false,
roundCap: true,
clip: false,
itemStyle: {
// color: ['#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
}
},
axisLine: {
lineStyle: {
width: 10 // 进度条宽度
// color:[[1, '#FF0000'],[1, '#000000']]
}
},
splitLine: {
show: false,
distance: 0,
length: 10
},
axisTick: {
show: false
},
axisLabel: {
show: false,
distance: 50
},
data: gaugeData,
title: {
fontSize: 10 // 数字下面title的字体
},
detail: {
width: 50,
height: 14,
fontSize: 14,
color: 'auto',
// borderColor: "auto",
borderRadius: 20,
// borderWidth: 2,
formatter: '{value}%'
}
}
]
};
以上是echarts 图例的配置
Version
5.2.2
Link to Minimal Reproduction
https://echarts.apache.org/examples/zh/editor.html?c=gauge-ring
Steps to Reproduce
url: https://echarts.apache.org/examples/zh/editor.html?c=gauge-ring
option:
Current Behavior
会有虚线显示
Expected Behavior
不显示虚线
Environment
Any additional comments?
以上是echarts 图例的配置