DEV Community

FlyingAndFly
FlyingAndFly

Posted on

What are the methods for data sampling in VChart charts?

Problem Description

May I ask if there are any data sampling configurations in vchart to improve performance when the amount of data in the line chart is large?

Solution

VChart line chart, since the 1.6.0version supports data sampling method configuration.

The downsampling strategy for line charts when the data volume is much larger than the pixel points can effectively optimize the drawing efficiency of the chart when turned on. It is turned off by default, that is, all drawings without filtering Data Points. Optional values for samplingconfiguration:

  • 'Lttb': Using Largest-Triangle-Three-Bucket algorithm, it can maximize the trend, shape and extreme value of the sampled line.
  • 'Min': Take the minimum value of the filter point
  • 'Max': take the maximum value of the filter point
  • 'Sum': take the sum of the filter points
  • 'Average': Take the average of the filter points

The sampling effect can be adjusted through the samplingFactor configuration.

sampling: 'lttb',
samplingFactor: 0.1,
Enter fullscreen mode Exit fullscreen mode

Code Example

https://visactor.io/vchart/demo/line-chart/line-sampling

Results

Quote

Top comments (0)