echarts折线图如何显示图例

要在 Echarts 折线图中显示图例，需要在 option 中添加 legend 属性，并定义相应的 data，如下所示：

option = {
    legend: {
        data:['数据一','数据二']
    },
    ...
    series: [
        {
            name:'数据一',
            type:'line',
            data:[10, 20, 30, 40, 50]
        },
        {
            name:'数据二',
            type:'line',
            data:[50, 40, 30, 20, 10]
        }
    ]
}

其中，legend.data 中的数据为每个系列的名称，series 中的 name 属性与 legend.data 中的名称对应。这样，就可以在图表上方或下方显示图例了。

相关问题

echarts折线图增加图例

可以通过在Echarts的option中设置legend属性来增加图例。具体方法如下：

option = {
    // ... 其他配置项
    legend: {
        data: ['图例1', '图例2', '图例3'] // 图例的数据数组
    },
    series: [
        {
            name: '图例1',
            type: 'line',
            data: [10, 20, 30, 40, 50]
        },
        {
            name: '图例2',
            type: 'line',
            data: [50, 40, 30, 20, 10]
        },
        {
            name: '图例3',
            type: 'line',
            data: [30, 50, 10, 40, 20]
        }
    ]
};

在上面的代码中，legend属性中的data数组包含了所有的图例名称，series数组中的每个元素都代表了一个折线图，其中name属性指定了该折线图对应的图例名称。

如果需要自定义图例，可以在legend属性中设置formatter属性，然后在回调函数中返回自定义的HTML代码。例如：

option = {
    // ... 其他配置项
    legend: {
        formatter: function(name) {
            return '<span style="color:red;">' + name + '</span>'; // 返回自定义的HTML代码
        },
        data: ['图例1', '图例2', '图例3'] // 图例的数据数组
    },
    series: [
        // ... 其他折线图配置
    ]
};

上面的代码中，formatter属性指定了一个回调函数，该函数的参数name表示当前图例的名称，函数返回一个字符串，其中包含了自定义的HTML代码。在这个例子中，我们将所有的图例名称都设置为红色。

echarts折线图图例

在ECharts中，绘制折线图的图例可以通过设置legend属性来实现。可以使用legend的data属性来指定图例的文字内容，如['进水(L)','出水(L)']。同时，可以通过设置legend的textStyle属性来修改图例文字的颜色，如设置fontSize为12，color为'#ffffff'。此外，还可以通过设置legend的orient属性来指定图例的布局方式，如horizontal表示水平布局，vertical表示垂直布局。可以通过设置legend的x和y属性来调整图例的位置，如x设置为'center'表示水平居中，y设置为'top'表示垂直居顶。具体的代码示例如下：

option = {
  // 其他配置项...
  legend: {
    orient: 'horizontal',
    x: 'center',
    y: 'top',
    textStyle: {
      fontSize: 12,
      color: '#ffffff'
    },
    data: ['进水(L)', '出水(L)']
  },
  // 其他配置项...
};

这样就可以在ECharts的折线图中添加图例，并自定义图例的样式和位置。