PHP前端开发

ECharts中如何实现双轴同时显示标签?

百变鹏仔 2个月前 (11-26) #echarts
文章标签 如何实现

echarts中双轴均显示ラベル

在echarts中,为双轴同时显示ラベル需要设置两个x轴。代码如下:

option = {  xAxis: [    {      type: 'category',      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']    },    {      type: 'category',      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']    }  ],  yAxis: [    {      type: 'value',      inverse: true    },    {      type: 'value'    }  ],  series: [    {      data: [120, 120, 10, 80, 70, 70, 130],      type: 'bar',    },    {      data: [10, 20, 110, 50, 30, 20, 80],      type: 'bar',      xAxisIndex: 1,      yAxisIndex: 1    }  ]};

这将生成如下图所示的图表,其中两个x轴都显示了标签:

[图片]

对于使用axislabel来取值的图表,需要在axislabel的格式化函数中实现类似的逻辑。