设置echarts 图例为长方形

news2026/4/10 1:13:31

在 ECharts 中要将图例legend的标记icon设置为长方形矩形可以通过legend配置项中的icon属性来实现。✅ 方法使用icon: rectECharts 内置了多种图例标记样式其中rect表示矩形长方形。配置方式option{legend:{icon:rect,// 所有图例项都使用矩形图标// 其他位置配置...},series:[{name:销量,type:line,data:[...]},{name:库存,type:line,data:[...]}]} 效果说明默认图例图标是圆形circle设置icon: rect后所有图例前的标记会变成小矩形长方形矩形尺寸由 ECharts 自动控制通常宽高比约为 2:1横向长方形✅ 进阶为不同系列设置不同图标可选如果你只想对特定系列使用矩形可通过series中的legendIcon但注意ECharts 官方不支持 per-series 的 legend icon。因此统一设置legend.icon是唯一可靠方式。⚠️ 注意legend.data中不能单独指定 icon必须全局设置。️ 其他内置 icon 类型参考值说明circle圆形默认rect矩形长方形✅roundRect圆角矩形triangle三角形diamond菱形pin水滴形arrow箭头none不显示图标示例完整代码option{legend:{left:left,top:top,icon:rect// ← 关键配置},xAxis:{type:category,data:[A,B,C]},yAxis:{type:value},series:[{name:销量,type:line,data:[10,20,30]},{name:库存,type:line,data:[15,25,35]}]};这样你的 ECharts 图例就会显示为长方形标记符合你的需求。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2501232.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！