echarts [Bug] Connected Charts Zoom & Zoom reset behaviors are not consistent

wsxa1bj1  于 3个月前  发布在  Echarts
关注(0)|答案(4)|浏览(75)

Version

5.4.2

https://codepen.io/ragava28/pen/dyQPZNb?editors=0010

Steps to Reproduce

https://codepen.io/ragava28/pen/dyQPZNb?editors=0010

  1. Click on zoom button from toolbox in any chart.
  2. Which enables zoom in all connected charts , so users can zoom from any connected chart.
  3. After zooming , Zoom reset button gets enabled, but only from the chart in which user performed zoom in operation.
  4. It should also get enabled for all the connected charts .

Any suggestions to enable zoom reset for all the connected charts

Current Behavior

Zoom reset button gets enabled, but only from the chart in which user performed zoom in operation.

Expected Behavior

Zoom reset button should get enabled for all connected charts .

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

We have connected charts as shown in above screen shot , in which each row is a line chart connected in x-axis, and we are hiding zoom & zoom reset for all other charts except 1st row.

As all are connected charts , user clicks on zoom button in 1st row chart from tool box, and he can zoom from any connected chart (like 2nd ,3rd ..etc.) , but zoom reset is working only from the chart which user has zoomed .

Any way to enable zoom reset on all charts. Any suggestion is well appreciated

pkln4tw6

pkln4tw61#

The simple solution, since zoom/reset is shared, is to use only one toolbox for both charts.

uubf1zoe

uubf1zoe2#

I already tried it, please see below sample .
https://codepen.io/ragava28/pen/KKrwbYP?editors=0010

In the sample I removed toolbox code for chart 2 & kept it for chart1 & both charts are connected. after this change, Zoom & zoom reset both functionality are broken.

6rqinv9w

6rqinv9w3#

sorry, I meant "only one visible toolbox".
But once hidden, zooming cannot be started on that second chart and has to be initiated always from the first. Which is a bad option.
Since toolbox is a poor choice, why not do it thru dataZoom ?
I think the following is pretty good UI, with or without the (first) visible dataZoom. And functionality is the same.

option1= {...
  toolbox: { feature: { restore:{} } },
  dataZoom: [{}, {type:'inside'}],
...}
option2= {...
  dataZoom: [{show:false}, {type:'inside'}],
...}
zzzyeukh

zzzyeukh4#

these charts are going to have high data density , zooming using dataZoom will make it difficult for user to interact with charts. initially we had restore button(like shown in below example) in place of zoom reset, which was working fine , but we recently realized that restore removes newly added data(real time data) or objects like (mark line or mark area) after initial load of the chart.

https://codepen.io/ragava28/pen/LYXVNMJ?editors=0010

in above example chart 1 & 2 are connected charts and every 5 seconds a new sample gets added to the chart1. after loading few new samples, when we click on restore , it removes the newly added samples , until the next new sample shows up & we rebind the complete data object back to chart. because of this gap we are trying with zoom reset.

相关问题