apache / echarts

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

[Bug] After calling clear, there are still remnants in the chart #19893

Open Xiaobaishushu25 opened 4 months ago

Xiaobaishushu25 commented 4 months ago

Version

5.5.0

Link to Minimal Reproduction

https://echarts.apache.org/examples/zh/editor.html?c=candlestick-brush&code=MYewdgzgLgBArgBwMIgDYgE4wLwwOQDEADEQCYCGAzMHgNwBQokspIA7mCulroQKbASJOvQBmcMMCgBLcDAgJU0qABFyUcgAoM5Nmo0BKGAG96MGKj6xg6vgHNMAT33kcMANoBdBucuwAbuSocHwQbl4-FlYw_mhwALah4d5mMKKYMJp-MNJuRLQ5MAA8MDp66uQAdJZgdlAAFgXSANTNRqbm5jZQ9k4ulQhwEPXaui7u0p6VCkrAfJpEADQwAIwG7kSeBpHmgcGhA0MjZeOT26m7cYkQh8OaE8snFROe7gAsno9jz5MbnjAAPlK3w0L3cK3-AH5VjAAFwwAC0EPO5gAvqkMFY4BgwCYLjBur0MM4KvDCQ5iS5Fvi9iEIPDaaFqZ0YldQgy2RBUqiGOjxJIZHIbKhgHBULYALIAQU0FEcKAkUGWFEMeN25CwmIgYtguAiqXSWE0gSwuVwSyiuNwKqqjJuNTqjUKJRqTVa7Xx0lEmVyJTlCrAUA9LPMWp1txGeAReBRIaYMjAIR2MHRLJN8gSeWThsy6YAVlmYAW_eR5SBFQU8-61SHtfEYM1rRVKnaJoii68IcnU50w6goBHNM1NHWYAB6GD-8uBgyVKAgABi0gAHnxSJpKAZYz3MVBsbi-1BefRsk8NAwACSVOxWTQAJQA8g-ACoAfQAClLnwAJBv4Mc2mO5AQBAVgARUY7QCAwAANYIioABSACSlR5hA4B4Ms_JSLIYDaKEBgdMC5QaG4WqRNIYDKKMJHkOcqKxgaEg4XIiAqnwSD1BqUCaIRqTAJYGqvkEqC8RRVE8WedHHthgq4pR1FSXx6pYDabgzMoLg0S4sbxPKXEYAOoFQA-CByZo-KaCAZm4W4REsuQVHxOouHwqIQSgcyIaWDeYCkPC9khgARiAUDzvE8IrEs-IspYohQPCeBzIGfAYJhMWdDa8LuHgKjsAiCHgEklGkHwy6Yfg0oAKwVXg0pRbV0oAExEI1UqUK1ngZaiXksvOaAyAgAUZeYUAYNIdg3hgiXkMu0gQOlIadLN83viAlE9NNNZLaNjgIHwiXABgIAgXgI0pr1wWYKVGAAOrSKQDSRZdLIhRgN1cJgiUEMAv2LTtCDkKQpCUXYkXRTtMA9MuUAAMpQI4ljDZDXRoF9-DEMI509edCAncorlpMxcmZHjEDLIDOjxOTMB8Kgyx03eAhKvI0gAF58MGKNMNAMAgEFBa4IFkPzkNqxEOdaLJkt_N5u4OVxVAtXjXY9RK68w5k38xSsxzLbSHwbCw-zfDaxOTUGJ4_y4B10shru-58wLdtoudY4TmVY3kEgIHPp7iVsA9T2rAA7EQCDld1L0wCtEBrRtqXIztShgDB2WS9tKPLlKc0QEhfllTNqCoGdKMpudnzneKQV00nkNBeQsF2MdEikJ9W2ECHXelztPYsjjS39agIXLnXIaiHw6jYgdmdlzAenPiAaCUGPS3DOw8JjSE0d9coSP4IA4EqAEbG_2Q-7ORMIl0jOTesLu2rUAIPS7sCAZUA3OQgPAPUfCVJgdhjjZvUMc19yA3ggGOdy_hpBMAGLUU-O0YHgESoDJ67sJRvCagANkqFgvBeCQ4wCwQADiarg_BWCQ7-EweQih9QVhh1ofg_wCIaEULwfUJEjD2FYLZvPVhZD2EhwRMQqqlRKASIkW8eoTUACcxCmGUP8CsJqxD6hsPYQANTeCsBRKxJESIADJYKIGI4hFDCFyIUUI78VjFFUMwTgnh6jBHsJYSotRGj8Ehz4fEbBRBKjYO8QiSgxC3iGOIVFexMBKAh1kZUEOBjKCaMiQEmxTV9HiKSZojJlAskGPUR1SosiDFvDZhKSgOj8mSJiVUpJlB6iiOqZU5R3CLHfkqSsZpyTOndLZggmWkhZhpyJgKWyvFhY7QEpPDAwli5iQzn3EMA8UY2gAFpLwirPHajgc7zXzqVUeaQPJ8EWTvToQUMBHFXjtBG-1sp4BTnwAAGrVaZGo8BdTLks_uUcMqXOuds8w2dc4HMLvgESAyLlXOGIYyiIy8CQvOeWEyogABCML6g3JZKAbgUpUAIC4vCAJKxsZ_KWtA7UQQJSf2xfIeoG9jmoE8udUC41QhgqOVVc5INEiQEJk1c5CADZzHpB4DOkyKVBBCM9DOqNuDwlYBwduZyJVypiNKmeSJzk4rRltRAKrvkV3JSGZuD106Q0lZ0RWiUooAFIoUshVmrRKxCHU6pgD_CaLr8BVSIA67G5yrW-D4PFW1_rHW9m9QlfAbrI2jWsolLBlB3UZy9arGNeAVhYIDZDH5MBK5LRBfNC1O1g1Qz2jPJKtgKSOHjZOUkDaNCVHJH0CoHqQqtw1I4AA4rSplLKy6xzhWAGexg-ZgDWalEAbkTkXQzhpKAI6x30sZe5ZlfB51l3iJRRKNoJSUXrc5I5eB92zXrbHeOKUtrlvMGzcGEsjV5qDRnO5VbW3EnrWa0gnLZVlyyk2qoH6SQaA7dOCgxI-1i3XYOlGw7KIrvAFO46s6N1brg7nZ8MCRnjvXmwVDoF0OQ0XcugKq78MDs3SsyGw7yA11QGRvDBGqMep3WAPdFQD1gCPbNDjGgaWRzzRlQtIZdm51LUtctEBhQzy3nwD1i6pSYnIHSlkTGoZXNOU-3uL6y7SaCLJzTHrv2_tWApxQygAByCQa5bUFRnWj9HGMMoozBljDnc6kZMOR5jRGdqxyw7BZza653UZ2iRhDwXXOhbJUtETLJ1mbIkyGctb6r78tKvW4tecC5HI2MsCECmNCGXhPIj1fA_IPsDedKTLnN5GYztl0z-XVjxduZWxKEAlA3XraLV1VVU16eKzGsrGcKv-XFo-3uwno5soNmK9wNWM5gHIIkRKeU2AFSKmEEqZVesdfwDYPylhoDYfrQBm0LZNXkwzsoPg8R4aIzHeq3F6MDV6o9fKzARBFXsE4B99Vb0Pp6vhK3UNCHSCfZgED1K7cfvwALqICHizquWuW6tqt1V9v3PwE887jbhSinFD0aUmhuWAYMAp-IS9g5yY9U8x7-9b18y_soRwxLKhVRR8-pbZcVtrcqlKBqHq0u44Q_jjQZIghE8lDKKKyoKiU4XdT0KWKNPbwzgzhGTP1XWUbmzjnXPtNLTCyyct_PMdShatjqteOPUAcJ2KWXmgWoK8MFTmnau6ea4Q4z57c8Wf64Rob7nOnecowt4laUHUbeJTtxnB30unck5lB1N3dEPeq_qxrsuWunuqc6Hr4ABuYABKNyjfNaJdMR4x4lTRbJY_4AbmlD1TXct_pRmJ_Z7ezMJ8bZd2IwRrixZDF8zoDFFhydjCyPSnFuKVBBgodQ38pQsTwoFUXeAAXDAQRqSeC2MpWu3_UZ8B3HkIdeec0A107yOVvh4PALVs0IiIFgl_TVapP7f6_hE1u2ssjb0OWJW6nxDHwYmPDEGJlsneVmREgmVSFnzfhbUEgwAWXMHdkQPnxvCgDWVQNnBgLQIJHAHQksGqBADsE0AACJABQO0ABM0wAC0VAALhMAAdTQAO2NKD6IgA

Steps to Reproduce

sorry,the Minimal Reproduction just describe my actions, it cant reproduction the bug,i dont konw why. this is the step: 1.quick Zoom the chart. and then scroll the mouse wheel to switch charts, it will clear the chart and reinit it. 2.ma line remaining on the chart. this is my switch code:

async function updateChart(){
  clear_all();
  await query_stocks_day_k_limit();
  await query_graphic();
}
function clear_all(){
  myChart.clear();
  // myChart.getZr().clear();
  chartIsInit = false;
  console.log("清除全部数据");
  rawData.value=[];
  graphicData.value.length = 0;
}
async function query_stocks_day_k_limit(){
  try {
    const data = await invoke<StockData[]>('query_stocks_day_k_limit', { code: code }); // 使用 await 等待 invoke 完成
    rawData.value = data.reverse(); // 处理查询到的数据
    myChart.clear();
    myChart.setOption(init_option(),true);
    myChart.resize();
    console.log("现在的配置是",myChart.getOption());
    chartIsInit = true;
    return;
  } catch (err) {
    console.log(err);
  }
}

i have use the clear() to clear the all chart, but there are still some residues.

https://github.com/apache/echarts/assets/76581880/a651021f-4353-4af3-bdf1-76c438d49574

Current Behavior

ma line remaining on the chart.

Expected Behavior

Completely clear the chart.(i use myChart.getZr().clear() can achivev).

Environment

- OS:Windows 10.0.19045.4291
- Browser:Edge 124.0.2478.67 
- Framework:Vue@3

Any additional comments?

use myChart.getZr().clear() can achivev completely clear the chart, but myChart.clear() there will be residue.

helgasoft commented 4 months ago

agree, and suspect the bug is related to series on multiple grids - Demo. myChart.clear() works for:

When multiple series in some grid AND series in each grid, then myChart.clear() does not remove some series. Also for the workaround - myChart.getZr().clear(); needs to follow myChart.clear(); - at least in my Demo.