Chart.js Trendline Plugin Demonstration
Projection, Data Offset, and Null Value Handling
Observations Guide:
- Dataset 1 (Blue, Dotted Trend): Shows a standard projected trendline extending to the chart's X-axis boundaries.
- Dataset 2 (Red, Dashed Trend): Demonstrates a non-projected trendline. Notice how it only covers the span of its own data points (approx. x=15 to x=35).
- Dataset 3 (Teal, Solid Trend):
- Uses
projection: true.
trendoffset: 2 means the first two data points ( (50,10) and (55,12) ) are excluded from the trendline calculation.- Contains a
null data point (originally at x=65) which is correctly ignored by the trendline fitter.
- Dataset 4 (Orange, Dotted Trend):
- Uses
projection: true.
trendoffset: -2 means the last two data points ( (40,7) and (50,10) ) are excluded from the trendline calculation.
- All trendlines should be clipped correctly within the chart area boundaries, even if their mathematical extension would go beyond.
- The slope displayed in the labels should consistently reflect the underlying data used for fitting, regardless of projection.