echarts给双x轴加标记
时间: 2023-06-29 10:18:09 浏览: 167
要给 echarts 双x轴加标记,可以使用 xAxis 中的 axisPointer 属性。具体操作如下:
1. 在 xAxis 中定义两个 x 轴,分别为 xAxis 和 xAxis2。
2. 在 yAxis 中定义 y 轴。
3. 在 series 中定义数据。
4. 在 tooltip 中定义提示框。
5. 在 xAxis 中使用 axisPointer 属性对两个 x 轴分别进行标记设置。
以下是示例代码:
```
option = {
xAxis: [
{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
gridIndex: 1
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: 'A',
type: 'line',
data: [10, 20, 30, 40, 50, 60, 70]
},
{
name: 'B',
type: 'line',
data: [70, 60, 50, 40, 30, 20, 10],
xAxisIndex: 1,
yAxisIndex: 0
}
],
tooltip: {
trigger: 'axis'
},
xAxis: [
{
axisPointer: {
type: 'shadow'
}
},
{
axisPointer: {
type: 'shadow'
},
gridIndex: 1
}
]
};
```
在上述示例代码中,第一个 xAxis 对应于第一个系列的 x 轴,第二个 xAxis 对应于第二个系列的 x 轴。在两个 xAxis 中都使用了 axisPointer 属性来定义标记样式,其中 gridIndex 属性用于指定对应的网格。
阅读全文