[英]Is there a way on echarts to get the series colors
I'm using Echarts v5.2.2 (in an Angular project, with ngx-echarts) to render a line chart using multiple series.我正在使用 Echarts v5.2.2(在 Angular 项目中,使用 ngx-echarts)使用多个系列渲染折线图。 I have a listener for the 'highlight' event.我有一个“highlight”事件的监听器。 This event is giving me an object with a batch of seriesIndex
and dataIndex
but it doesn't provide the color of each series.这个事件给了我一个带有一批seriesIndex
和 dataIndex 的dataIndex
但它不提供每个系列的颜色。
Is there a way to get the colors that were dynamically assigned by echarts?有没有办法获得由echarts动态分配的colors?
This is what I'm trying to implement:这就是我要实现的:
this.chartInstance.on('highlight', this.handleShowTip);
通过this.chartInstance.on('highlight', this.handleShowTip);
执行此操作. .seriesIndex
& dataIndex
where the mouse pointer snapped to render a table using color, x & y value as columns (the table is placed outside the graph.使用鼠标指针捕捉到的一批seriesIndex
和dataIndex
以使用颜色、x 和 y 值作为列来呈现表格(表格放置在图表之外。I understand that I could use the tooltip's formatter option with a callback function which will provide the series colors in its arguments... and I could broadcast these arguments outside my graph component to render what I need anywhere I want, but this does not feel correct (a formatter is aimed to return HTML or string) and I wonder if there's a better way to get the generated series colors. I understand that I could use the tooltip's formatter option with a callback function which will provide the series colors in its arguments... and I could broadcast these arguments outside my graph component to render what I need anywhere I want, but this does not feel正确(格式化程序旨在返回 HTML 或字符串),我想知道是否有更好的方法来获取生成的系列 colors。
Thank you!谢谢!
The Echarts uses a built-in palette based on the theme. Echarts 使用基于主题的内置调色板。 The easiest way to get a set of colors is this:获得一组 colors 的最简单方法是:
myChart.getOption().color
To get the colors that are mapped to the series, you can do the following:要获取映射到系列的 colors,您可以执行以下操作:
myChart.getModel().getSeries().map(s => {
return {
seriesIndex: s.seriesIndex,
seriesColor: myChart.getVisual({
seriesIndex: s.seriesIndex
}, 'color')
}
})
And the result will be something like this:结果将是这样的:
[
{
"seriesIndex":0,
"seriesColor":"#5470c6"
},
{
"seriesIndex":1,
"seriesColor":"#91cc75"
},
{
"seriesIndex":2,
"seriesColor":"#fac858"
},
{
"seriesIndex":3,
"seriesColor":"#ee6666"
},
{
"seriesIndex":4,
"seriesColor":"#73c0de"
}
]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.