I want to build a column chart but I got the following error:
ERROR TypeError: Cannot read property ‘append’ of undefined
The error happened in line #42.
My code:
export class OutputAmplitudeComponent implements OnInit, OnDestroy {
constructor(@Inject(SETTING_SERVICE) private settingService: SettingService, private cdr: ChangeDetectorRef) {}
ngOnInit() {
this.settingService.registerSetting(HarmonicAmpSetting).pipe(takeUntil(this.ngUnsubHarmonicData)).subscribe(setting => {
const OutputAmplitudeData = setting.value;
for (let x = 1; x < this.numberOfOutput; x++) {
if (this.OutputMode === 'Voltage') {
if (phaseNum === 1) {
this.ampSource.data[x-1].voltage1 = OutputAmplitudeData[x];
} else if (phaseNum === 2) {
this.ampSource.data[x-1].voltage2 = OutputAmplitudeData[x];
} else if (phaseNum === 3) {
this.ampSource.data[x-1].voltage3 = OutputAmplitudeData[x];
}
} else if (this.OutputMode === 'Current') {
if (phaseNum === 1) {
this.ampSource.data[x-1].current1 = OutputAmplitudeData[x];
} else if (phaseNum === 2) {
this.ampSource.data[x-1].current2 = OutputAmplitudeData[x];
} else if (phaseNum === 3) {
this.ampSource.data[x-1].current3 = OutputAmplitudeData[x];
}
}
}
this.updateData();
});
this.sciChartInit();
}
updateData(){
var phaseNum1 = [];
var xData = [];
for (let x = 1; x < this.numberOfOutput; x++) {
if (this.ampSource.data != null && this.ampSource.data[x-1] != null) {
phaseNum1[x - 1] = parseFloat(this.ampSource.data[x - 1].voltage1);
xData[x - 1] = x;
if (!isNaN(phaseNum1[x - 1])) {
this.dataSeries1.append(x,x);
} else {
console.log("No num");
}
}
}
}
async sciChartInit() {
const { wasmContext, sciChartSurface } = await SciChartSurface.create("chart");
var phaseNum1 = [];
var xData = [];
this.dataSeries1 = new XyDataSeries(wasmContext);
for (let x = 1; x < this.numberOfOutput; x++) {
this.dataSeries1.append(x, x);
}
const xAxis = new NumericAxis(wasmContext);
sciChartSurface.xAxes.add(xAxis);
const yAxis = new NumericAxis(wasmContext);
sciChartSurface.yAxes.add(yAxis);
const rendSeries1 = new StackedColumnRenderableSeries(wasmContext);
rendSeries1.fill = "#dc443f";
rendSeries1.stroke = "green";
rendSeries1.strokeThickness = 1;
rendSeries1.dataSeries = this.dataSeries1;
rendSeries1.stackedGroupId = "one";
const verticallyStackedColumnCollection = new StackedColumnCollection(wasmContext);
verticallyStackedColumnCollection.dataPointWidth = 0.5;
verticallyStackedColumnCollection.add(rendSeries1);
verticallyStackedColumnCollection.animation = new ScaleAnimation({ duration: 1000, fadeEffect: true });
sciChartSurface.renderableSeries.add(verticallyStackedColumnCollection);
sciChartSurface.chartModifiers.add(new ZoomExtentsModifier(), new ZoomPanModifier(), new MouseWheelZoomModifier());
sciChartSurface.zoomExtents();
sciChartSurface.chartModifiers.add(
new LegendModifier({
placement: ELegendPlacement.TopRight,
orientation: ELegendOrientation.Horizontal,
showLegend: true,
showCheckboxes: true,
showSeriesMarkers: true
})
);
return { wasmContext, sciChartSurface };
}}
I don’t understand what is undefined and why.
Thank you.
- ETS Ong asked 3 years ago
- last edited 3 years ago
-
Hi, It looks like this.updateData() method in line 29 is being called before this.sciChartInit() in line 31 is complete. Please note, that sciChartInit() in line 50 is asynchronous function and we should await until the promise is resolved in order to have this.dataSeries1 property in line 56 set. Best regards, Michael
- You must login to post comments
Hi there,
It means when you call this function
this.dataSeries1.append(x,x);
this.dataSeries1 is undefined or null.
The reason for that I don’t know without having access to some code to reproduce the problem. Try putting some logging in your code to check
e.g.
console.log("DataSeries is " + this.dataSeries1 === undefined ? "NULL" : "Not Null");
This will help you diagnose the problem
Best regards,
Andrew
- Andrew Burnett-Thompson answered 3 years ago
-
Hi Andrew, it works after I change the Scichart version from “1.4.1622” to “1.4.1618”.
- You must login to post comments
Please login first to submit.