有没有办法让自定义图例在Echarts中切换线条

Question

我正在使用

echarts

库开发多图表布局。 所有图表都有相同的图例，但数据集不同。

有没有办法在

echarts

中制作自定义图例部分，使用它我可以一次处理所有图表？

我尝试切换每个系列的“显示”属性和“可见”属性，但所做的只是隐藏图表上的数据点而不是完整的系列。

Answer 1

您可以添加共享图例并在所有图表中使用它

const legend = {
    type: 'scroll',
    orient: 'vertical',
    right: 10,
    top: 20,
    bottom: 20,
    data: ['Legend A', 'Legend B', 'Legend C' /* ... */, , 'Legend x']
    // ...
  }

// chart 1
const chart1 = echarts.init(dom1)
chart1.setOption({
    legend,
    dataset: {
      source: [
        // ...
      ]
    },
    // other settings...
  },
})

// chart 2
const chart2 = echarts.init(dom2)
chart2.setOption({
    legend,
    dataset: {
      source: [
        // ...
      ]
    },
    // other settings...
  },
})

或者你可以包装在你自己的函数中

function createEchartOption(dataset){
  return {
    dataset,
    legend: {
    type: 'scroll',
    orient: 'vertical',
    right: 10,
    top: 20,
    bottom: 20,
    data: ['Legend A', 'Legend B', 'Legend C' /* ... */, , 'Legend x']
    // ...
  },
  // other settings...
}

const chart = echarts.init(dom)
chart.setOption(createEchartOption({...}))