-
Notifications
You must be signed in to change notification settings - Fork 19.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Question: Dynamically change data existing data on Zoom event #4990
Comments
I am afraid that I am not quite sure about what you expect exactly. I guess that you what to do something about data in according to the zoom window, isn't it? In the sample (https://github.com/ecomfe/echarts/blob/master/test/connect-manually.html) you mentioned you can see that in the zoom event var originalData = [
[12, 323, 443],
[44, 33, 77],
[6, 78, 13],
[12, 13, 94]
];
chart.setOption({
...,
dataZoom: {
xAxisIndex: 0,
...
},
series: [{
...,
data: originalData
}]
});
chart.on('dataZoom', function (params) {
var start = params.batch[0].start;
var end = parasm.batch[0].end;
var dataInWindow = originalData.filter(function (item) {
return item[0] >= start || item[0] <= end;
});
// do something others ...
}); |
it works but when I apply a function after that (dividing all the values in dataInWindow by the initial value => thus rescaling the data on window) it takes forever to compute which means I can't use as a production tool for obvious reasons. do you happen to know whether some shortcuts are available? thank you for your quick answer |
From what I see dataZoom event start and end params is percentage values of the total range of a data array. var start_index=Math.round(data.values.length*(param.start/100))-1;
var end_index=Math.round(data.values.length*(param.end/100))-1; |
Another way to do it is using the current chart instance
|
Sadly it seems that the workaround proposed by @dan5000 doesn't work anymore with echarts 5. |
myChart.on('datazoom', (evt) => { |
Im using vue echarts and this is how im changing the startValue/endValue instead:
|
Is there any way to apply this in React? Any experience? |
One-line summary [问题简述]
How to Dynamically change existing data (data contained in the shown window) on Zoom event?
Version & Environment [版本及环境]
Expected behaviour [期望结果]
asking here for lack of a better place: I'd like to know whether there was a get the values referring to the Zoom Area and apply a function on them. in my case it would be very nice to have if I could access the data. in the API there does not seem to be an explicit way so I was hoping for some DOM coordinates (like series.data.values[0])
specifically, I was looking at this: https://github.com/ecomfe/echarts/blob/master/test/connect-manually.html
ECharts option [ECharts配置项]
Other comments [其他信息]
FYI: Echarts is, by all accounts, exceptional work
The text was updated successfully, but these errors were encountered: