apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.65k stars 19.61k forks source link

[Bug] resize and bargraph highlight #19742

Open tfp-Im opened 8 months ago

tfp-Im commented 8 months ago

Version

e.g. 5.2.2

Link to Minimal Reproduction

https://codepen.io/h2yn/pen/VwNpBBd

Steps to Reproduce

Kapture 2024-03-21 at 19 32 35

var dom = document.getElementById('chart-container'); var myChart = echarts.init(dom, null, { renderer: 'canvas', useDirtyRect: false }); var app = {};

var option;

option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [ { data: [120, 200, 150, 80, 70, 110, 130], type: 'bar', showBackground: true, backgroundStyle: { color: 'rgba(180, 180, 180, 0.2)' }, emphasis: { itemStyle: { color: "rgba(75, 137, 255, 0.6)", }, }, } ] };

if (option && typeof option === 'object') { myChart.setOption(option); }

this.test();

window.addEventListener('resize', myChart.resize);

function test(){ setTimeout(()=>{ console.log("test"); myChart.setOption(option); myChart.resize(); this.test(); },1000) };

Current Behavior

  1. Define a method to restart resize
  2. Draw echart in computer, smartphone environment
  3. computer(hover), smartphone(click) on the graph bar
  4. resize and Graph highlights don't disappear

Expected Behavior

  1. Define a method to restart resize
  2. Draw echart in computer, smartphone environment
  3. computer(hover), smartphone(click) on the graph bar
  4. resize and Graph highlights disappear

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

  1. This is because the mouseout event of the graph does not occur, but I think that at least the highlight should be initialized when it is resized.
helgasoft commented 8 months ago

the setTimeout function may be adding values to the series, but as long as xAxis stays the same chart will not change.

resize and Graph highlights disappear

What does this mean ?

tfp-Im commented 8 months ago

the setTimeout function may be adding values to the series, but as long as xAxis stays the same chart will not change.

resize and Graph highlights disappear

What does this mean ?

I added that part by mistake.So I deleted it. thank you. What I want to ask is that when the graph resize event occurs and the bar part of the graph is hovered, the highlight remains. I think it is a bug that the highlight does not disappear.

tfp-Im commented 8 months ago

the setTimeout function may be adding values to the series, but as long as xAxis stays the same chart will not change.

resize and Graph highlights disappear

What does this mean ?

the setTimeout function may be adding values to the series, but as long as xAxis stays the same chart will not change.

resize and Graph highlights disappear

What does this mean ?

I added that part by mistake.So I deleted it. thank you. What I want to ask is that when the graph resize event occurs and the bar part of the graph is hovered, the highlight remains. I think it is a bug that the highlight does not disappear.

Additionally, I believe that the reason this problem occurs is because the mouseout event is not executed when the resize event occurs.

tfp-Im commented 7 months ago

the setTimeout function may be adding values to the series, but as long as xAxis stays the same chart will not change.

resize and Graph highlights disappear

What does this mean ?

please, cant review my comment