What problem does this feature solve?
The current sampling algorithms work well when graphing a few charts, but the performance still suffers when graphing more and more plots on the same graph. I am trying to graph 50 plots on the same graph, but the performance becomes so bad that the page stops loading. I would like to lower the threshold of the downsampling strategy to reduce the number of points on the screen even further. Please see the threshold slider on the flot demo here: http://flot.base.is
What does the proposed API look like?
I'm not the most fluent in TS or this API, but I'd imagine you'd just do something like the following and pass this through to the sataSample(seriesType) function. If the threshold value != None, replace "1 / rate" in the data.lttbDownSample or data.downSample function call with that value.
SeriesOption{
type: 'line',
data: data,
sampling:{
type: 'lttb',
threshold:100 //This could be user controlled and will be passed into the seriesModel.setData(data.lttbDownSample(data.mapDimension(valueAxis.dim), threshold)); call
}
9条答案
按热度按时间cotxawn71#
Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.
In the meanwhile, please make sure that it contains a minimum reproducible demo and necessary images to illustrate. Otherwise, our committers will ask you to do so.
A minimum reproducible demo should contain as little data and components as possible but can still illustrate your problem. This is the best way for us to reproduce it and solve the problem faster.
You may also check out the API and chart option to get the answer.
If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org . Please attach the issue link if it's a technical question.
If you are interested in the project, you may also subscribe our mailing list .
Have a nice day! 🍵
arknldoa2#
I'm not sure if the performance bottleneck is line rendering and sampling to fewer points can fix it. From my experience, current points number after sampled(around 1k) should not have render performance issues. Could you provide you examples for us to find out where the performance bottleneck is?
xu3bshqb3#
Here's a jsfiddle . I had to reduce the number of samples because otherwise the browser would freeze when attempting to draw the plots. If you change symbols to to 'none' and set the tooltip trigger to 'axis' , it works much smoother, but the axis tooltip does not work well for checking individual points which is needed with so many plots on the graph. I think that reducing the number of points using a lower sampling threshold will drastically improve performance.
e37o9pze4#
I forgot to mention that it is a live updating graph. I think because it is a live graph, line/symbol rendering happens very often and downsampling to fewer points would mean less points to render. Rendering fewer points would improve performance, and would probably make it look nicer (in my case since I'm taking so many measurements).
piah890a5#
I think don't show symbol is better choice and it will make the graph much more clear
6ioyuze26#
Unfortunately I can't hover over the point to see the tooltip if I do that. I can't use axis tooltip mode because it shows every single point, and there are too many measurements to fit on the screen. I want to be able to hover over a point and see the label and value for that one point. Do you know of a way I can use tooltip trigger "item" along with symbol "none"? If there is not, then I would like to go the route of reducing the number of samples on screen at a time if possible. I feel like there could be many other applications where you would want to simplify a graph by changing the downsampling threshold from the default.
lc8prwob7#
If this isn't an option, is there a way to accelerate the chart loading using WebGL? I know that echarts uses webgl to implement several 3d charts. Is is possible to use webgl to draw this 2d line chart?
idv4meu88#
Unfortunately I can't hover over the point to see the tooltip if I do that. I can't use axis tooltip mode because it shows every single point, and there are too many measurements to fit on the screen. I want to be able to hover over a point and see the label and value for that one point. Do you know of a way I can use tooltip trigger "item" along with symbol "none"? If there is not, then I would like to go the route of reducing the number of samples on screen at a time if possible. I feel like there could be many other applications where you would want to simplify a graph by changing the downsampling threshold from the default.
We are planning to enhance the line tooltip and can able to snap to the data point, even if the symbol is not drawn.
If this isn't an option, is there a way to accelerate the chart loading using WebGL? I know that echarts uses webgl to implement several 3d charts. Is is possible to use webgl to draw this 2d line chart?
In this case, I think WebGL may be even worse. Especially there is a limitation of WebGL context number in one page. 50 chart instances may cause most of them failing to render.
mzsu5hc09#
We are planning to enhance the line tooltip and can able to snap to the data point, even if the symbol is not drawn.
Yes, that would be great to have!
In this case, I think WebGL may be even worse. Especially there is a limitation of WebGL context number in one page. 50 chart instances may cause most of them failing to render.
I wouldn't want 50 chart instances, just one/two/three graphics accelerated charts with many plots. For instance, webgl plot does this. I'm obviously not as experienced as you are in chart graphics, but it was just a thought.
I still think that being able to set the downsampling threshold would be a helpful feature for making graphs less noisy. Example