echarths 使用环形柱状图实行环比效果
var option = {
angleAxis: {
startAngle:90, // 开始位置
clockwise:false,// 是否顺时针
max:100,// 坐标轴最大值100
axisLine:{
show:false // 不显示坐标轴
},
splitNumber:1,
axisTick:{
show:false,//是否展示刻度
},
},
radiusAxis: {
type: 'category',
data: [
{
value:10,
label:{
show:true,
position: 'top'
}
},
{
value:20,
label:{
show:true,
position: 'top'
}
},
{
value:30
},
],
z: 10,
label:{
hoverOffset: 0,//高亮扇区的偏移距离。
clockwise: false,//饼图的扇区是否是顺时针排布。
startAngle: 90,//起始角度,支持范围[0, 360]。
},
axisLine:{
show:false
},
axisTick:{
show:false,//是否展示刻度
length:2,// 刻度长度
splitNumber:20
},
axisLabel:{
inside: false
}
},
polar: {
},
series: [
{
type: 'bar',
data: [
{
value: 10,
itemStyle:{
color:'#3bd8a3'
}
},
{
value: 20,
itemStyle:{
color:'#f5a623'
}
},
{
value: 30,
itemStyle:{
color:'#006be0'
}
}
],
coordinateSystem: 'polar',
name: 'A',
stack: 'a',
barMaxWidth:'27%', // 柱状图的粗细
},
{
type: 'bar',
data: [
{
value:100-10,
itemStyle:{
color:'#eceef0'
}
},
{
value: 100-20,
itemStyle:{
color:'#eceef0'
}
},
{
value: 100-30,
itemStyle:{
color:'#eceef0'
}
}
],
coordinateSystem: 'polar',
name: 'B',
stack: 'a',
barMaxWidth:'27%', // 柱状图的粗细
}
],
// legend: {
// show: true,
// data: ['A', 'B']
// }
};