How to highlight selected data point.

One-line summary [问题简述]

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]:
• Browser version [浏览器类型和版本]:
• OS Version [操作系统类型和版本]:

Expected behaviour [期望结果]

You guys are doing fabulous work, I really appreciate your work in the field of charting library. Please help me in following problem, When user click on any data point on chart then I want to highlight that particular data point, like shown in following image.

I have achieve above effect using “brush” but I want to do this for all chart supported by echart. I have gone through visual-map, highlight action. Please suggest me the way to do this.

ECharts option [ECharts配置项]

option = {

}

Other comments [其他信息]

[gbrian]

In my case to get the effect above, I’m using itemStyle.opacity I’m storing local “state” on each series point to know if it’s selected. Then applying the style based on the “selected” state.

So more or less:

var series = this.chartOption.series;
var clickSeries = series[event.seriesIndex].data;
var entry = clickSeries[ev.dataIndex];
entry.clicked = !entry.clicked;
var any = clickSeries.filter(d => d.clicked).length !== 0;
series.map(d => d.itemStyle.opcacity = !any || d.clicked ? 1: 0.3);
echart.setOption({series});

So instead hightlight you lowlight others 😃

[zhixuan-loh]

In my case to get the effect above, I’m using itemStyle.opacity I’m storing local “state” on each series point to know if it’s selected. Then applying the style based on the “selected” state.

So more or less:

var series = this.chartOption.series;
var clickSeries = series[event.seriesIndex].data;
var entry = clickSeries[ev.dataIndex];
entry.clicked = !entry.clicked;
var any = clickSeries.filter(d => d.clicked).length !== 0;
series.map(d => d.itemStyle.opcacity = !any || d.clicked ? 1: 0.3);
echart.setOption({series});

So instead hightlight you lowlight others 😃

Thank you for the workaround. I’m new to Echarts and I tried to implement this feature using their options API and I couldn’t get it to work even though I strongly believe this is a commonly needed feature. I tried your workarouhnd and it worked. But I was thinking Echarts should be able to provide this feature since it worked for similar charts like bar chart. Does anyone here have any solution to this issue?