Echart 从竖着列转横着列
只需要把yAxis 和 xAxis 里面的data换一下就可以了
转
分享这样的结构
this.chart.setOption({
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'false' // 默认为直线,可选为:'line' | 'shadow'
},
},
grid: {
top: 10,
left: '2%',
right: '2%',
bottom: '3%',
containLabel: true
},
xAxis: [{
type: 'value',
boundaryGap: [0, 0.01],
//取消水平线 信息
axisLine: {
show: false
},
//取消背景阴影
axisTick: {
show: false
},
//取消显示信息
show:false
}],
yAxis: [{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
//轴样式
axisLabel: {
show: true,
//轴字体颜色
textStyle: {
color: '#666666'
}
},
axisLine: {
show: false
},
axisTick: {
show: false
},
},{
type: 'category',
data: [79, 52, 200, 334, 390, 330],
axisLabel: {
show: true,
textStyle: {
color: '#333333'
}
},
axisLine: {
show: false
},
axisTick: {
show: false
},
}],
series: [{
name: 'pageA',
type: 'bar',
stack: 'vistors',
barWidth: '30%',
itemStyle:{color: "#1990FF"},
data: [79, 52, 200, 334, 390, 330],
animationDuration
}]
})
}
}
this.chart.setOption({
graphic:{
type:'text',
left:'center',
top:'center',
style:{
text:'使用次数',
fontSize: 16,
},
},
/*tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
x : '70%',
y : '25%',
orient: 'vertical',
left: 'left',
itemWidth:10,
itemHeight:10,
textStyle: {
fontSize: 14,
color:"#999",
},
formatter: function (name) {
return name.length > 20 ? (name.slice(0,20)+"...") : name
},
data: ['Industries部门 | 25.1% 12098', 'Technology部门', 'Forex部门', 'Gold部门', 'Forecasts部门']
},*/
series: [
{
left: 300,
name: 'WEEKLY WRITE ARTICLES',
type: 'pie',
radius: [70, 100],
center: ['50%', '50%'],
data: [
{ value: 320, name: 'Industries部门',itemStyle:{color: "#1990FF"}},
{ value: 240, name: 'Technology部门',itemStyle:{color: "#32CAE0"}},
{ value: 149, name: 'Forex部门',itemStyle:{color: "#58CC74"}},
{ value: 100, name: 'Gold部门',itemStyle:{color: "#FAC758"}},
{ value: 59, name: 'Forecasts部门',itemStyle:{color: "#EE6666"}}
],
animationEasing: 'cubicInOut',
animationDuration: 2600,
itemStyle : {
normal : {
label : {
show : false
},
labelLine : {
show : false
}
},
},
}]
})