echarts折线图legend样式

您好，以下是 echarts 折线图中 legend 样式的设置代码：

legend: {
  textStyle: {
    color: '#333',
    fontSize: 14
  }
}

在这个例子中，您可以通过设置 textStyle 来更改 legend 的字体颜色和大小。您还可以通过其他属性来更改 legend 的位置、方向和样式。希望对您有帮助！

相关问题

echarts 折线图 Legend

ECharts 折线图的 Legend（图例）用于展示每条折线所对应的数据系列名称。可以通过设置 Legend 的位置、样式、字体等属性来自定义 Legend。以下是一个样例代码，展示如何在 ECharts 中添加 Legend：

option = {
    legend: {
        data:['销量']
    },
    xAxis: {
        data: ["1月","2月","3月","4月","5月","6月"]
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'line',
        data: [5, 20, 36, 10, 10, 20]
    }]
};

在这个例子中，Legend 中只有一个数据系列名称，即“销量”。可以通过修改 `data` 属性来添加或删除 Legend 中的数据系列名称。

echarts折线图legend圆点

### 修改 ECharts 折线图 Legend 圆点样式

在 ECharts 中，可以通过 `legend` 配置项中的 `itemStyle` 来调整图例外圆点的样式。对于更复杂的定制需求，比如将默认的圆形图标改为其他形状或直接显示为线条，也可以通过设置 `icon` 属性来实现。

#### 自定义 Legend 的圆点样式

为了改变 legend 中项目对应的图形，默认情况下是圆形的小标记，如果想要将其替换为直线或其他形式，则可以在初始化图表时指定 `icon` 参数[^2]：

option = {
    legend: {
        data: ['销量'],
        icon: 'rect', // 可选值有 circle, rect, roundRect, triangle, diamond, pin, arrow 等
        itemWidth: 25,
        itemHeight: 5
    },
};

上述代码片段展示了如何把 legend 图标的形状从默认的圆形变为矩形，并且设置了宽度 (`itemWidth`) 和高度 (`itemHeight`) 让其看起来像一条短横线。当需要进一步微调这些线条的具体外观时，还可以利用 CSS 或者 echarts 提供的相关属性来进行更加细致化的控制。

另外，在某些场景下可能不仅限于整体更改所有 legend items 的表现形式，而是针对特定的数据系列做个性化处理。此时就可以借助 `series` 下面的 `symbol` 字段以及 `markPoint` / `markLine` 特殊高亮点/线的方式完成特殊化展示效果[^3]。

最后值得注意的是，除了静态配置外，动态更新 legend 样式也是可行的；例如监听用户的交互事件（点击、悬停），从而实时改变所选中状态下的 legend 表现[^1]。