Bad reference when using cubic bezier for Line chart

[Archez]

Summary

There seems to be a crash with the cubic bezier generate function for the line chart renderer when the data set changes and the graph is redrawn.

We have a line chart that displays a set of data for a time frame (x-axis is time). The chart refreshes once a minute and slowly shifts the graph away. Our API also only returns data for the valid time frame, e.g. if on the first load we may have 12 data points, and on the next call the first (oldest) data point will no longer get sent down and the graph will no longer display it.

I have not been able to figure out the exact steps to make it happen, but the crash generally occurs when the app is open and the device is locked for a few minutes, after unlocking the device the app crashes.

JS: ERROR: UnhandledError Error: Calling js method onDraw failed
JS: TypeError: Cannot read property 'next' of undefined generateCubicPath(file: node_modules/@nativescript-community/ui-chart/renderer/LineChartRenderer.js:243:0)
JS:     at draw(file: node_modules/@nativescript-community/ui-chart/renderer/LineChartRenderer.js:414:0)
JS:     at drawDataSet(file: node_modules/@nativescript-community/ui-chart/renderer/LineChartRenderer.js:146:0)
JS:     at drawData(file: node_modules/@nativescript-community/ui-chart/renderer/LineChartRenderer.js:129:0)
JS:     at onDraw(file: node_modules/@nativescript-community/ui-chart/charts/BarLineChartBase.js:120:0)
JS:     at onDraw(file: node_modules/@nativescript-community/ui-canvas/canvas.android.js:538:0)

Expected Behavior

No bad reference when computing the cubic bezier path.

Possible Solution

Add an extra check for the first pass of the cubic path generate logic.

Device (please complete the following information):

• Device: Google Pixel 4
• Android Version: 10.0
• Library Version: 1.2.14

Additional Context

The bad reference line in question is

ui-chart/src/charting/renderer/LineChartRenderer.ts

Line 353 in 2b6dd7f

float32arr[index++] = prevControlPoints.next.x;

ui-chart/src/charting/renderer/LineChartRenderer.ts

Lines 320 to 363 in 2b6dd7f

	const firstIndex = Math.max(0, this.mXBounds.min);
	// let firstIndex = this.mXBounds.min + 1;
	const lastIndex = this.mXBounds.min + this.mXBounds.range;
	const float32arr = this.mLineBuffer;
	let index = 0;
	let nextIndex = -1;
	let next: XYPoint;
	let controlPoints;
	let point: XYPoint;
	let prev: XYPoint;
	let prevControlPoints;
	for (let j = firstIndex; j <= lastIndex; j++) {
	point = getXYValue(dataSet, j);
	if (!point) {
	if (j === 0) {
	return [];
	}
	continue;
	}
	if (!prev) {
	prev = point;
	}
	nextIndex = j + 1 < dataSet.getEntryCount() ? j + 1 : j;
	next = getXYValue(dataSet, nextIndex);
	if (!next) {
	continue;
	}
	controlPoints = splineCurve(prev, point, next, intensity);
	if (j === 0) {
	float32arr[index++] = point.x;
	float32arr[index++] = point.y * phaseY;
	} else {
	float32arr[index++] = prevControlPoints.next.x;
	float32arr[index++] = prevControlPoints.next.y * phaseY;
	float32arr[index++] = controlPoints.previous.x;
	float32arr[index++] = controlPoints.previous.y * phaseY;
	float32arr[index++] = point.x;
	float32arr[index++] = point.y * phaseY;
	}
	prevControlPoints = controlPoints;
	prev = point;
	}

and my guess is this is happening because on the first run of this loop, j which is firstIndex is greater than 0, so the code tries to reference prevControlPoints which has not be created yet.

---

ADD A REWARD using Speed to SOLVE this issue QUICKLY and SUPPORT this project.

[DiegoMacBD]

@farfromrefug sorry to tag you just wanted to know if you had a chance to look into this.

[farfromrefug]

@DiegoMacBD there is something wrong with the chart data passed. I can fix it but i need to have sample ChartData