一效果图
场景应用图
二 代码
var symbols = [
'path://M480 64C250.24 64 64 250.24 64 480 64 709.76 250.24 896 480 896c229.76 0 416-186.24 416-416C896 250.24 709.76 64 480 64zM480 832C285.44 832 128 674.56 128 480 128 285.44 285.44 128 480 128 674.56 128 832 285.44 832 480 832 674.56 674.56 832 480 832z'
]; //symbols里面需要一个svg背景图,这个可以去阿里图库,可以获取到svg的数据,这个时候需要取path里面的值就好了不能直接复制进去
var bodyMax = 100; //可以设置最大值参数
option = {
xAxis: {
data: ['a'],
show: false //不需要x轴
},
yAxis: {
max: bodyMax,
splitLine: {show: false},
show: false //不需要Y轴
},
series: [{
name: 'typeA',
type: 'pictorialBar',
symbolClip: true,
symbolBoundingData: bodyMax,
data: [{
value: 43, //这个是参数就是占比
symbol: symbols[0]
}],
z: 10
}, {
name: 'full',
type: 'pictorialBar',
symbolBoundingData: bodyMax,
animationDuration: 0,
itemStyle: {
color: '#ccc'
},
data: [{
value: 1, //背景图
symbol: symbols[0]
}]
}]
};
加油加油