Estoy realizando un proyecto en angular (7) y al poner las gráficas de highchart (módulo highcharts-chart), me arroja el siguiente error por consola:
ERROR TypeError: Cannot read property 'series' of undefined
Lo raro es que el gráfico se muestra bien, pero creo que o le estoy pasando mal las variables, o mal inicializado o algo así, por lo tanto, aunque se me vea, me gustaría dejarlo sin errores de consola.
El codigo que tengo que es el siguiente.
Template HTML
<highcharts-chart [Highcharts]="Highcharts" [options]="graficoOptions"></highcharts-chart>
Controlador
this._contratosService.getEstados(localStorage.getItem('idCliente')).subscribe(
async data => {
this.graficoOptions= this._funcionesService.decodificarToken(data);
for (let i = 0; i < this.arraySituaciones.length; i++) {
this.array = this.array.concat([
{
name: this.arraySituaciones[i],
y: this.arrayContadorContratos[i],
selected: false
}
]);
}
this.options = JSON.parse(this._GraficosService.graficosOption);
this.graficoOptions= {
lang: this.options,
chart: { type: 'line' },
exporting: {
buttons: {
contextButton: {
menuItems: [
'printChart',
'separator',
'downloadPNG',
'downloadJPEG',
'downloadPDF',
'downloadSVG',
'separator',
'downloadCSV',
'downloadXLS'
]
}
}
},
title: { text: 'Estados de los contratos' },
subtitle: {
text:
'Se muestran la cantidad de contratos que existen en cada estado.'
},
tooltip: {
pointFormat:
'<span style="color:{series.color}">Contratos: </span>: <b>{point.y}</b><br/>',
shared: true
},
series: [
{
type: 'pie',
allowPointSelect: true,
keys: ['name', 'y', 'selected', 'sliced'],
data: this.array,
showInLegend: true
}
],
plotOptions: {
series: {
cursor: 'pointer',
events: {
click: function(e) {
console.log('1234');
}
}
}
},
credits: { enabled: false }
};
});
this.graficoOptions
sea undefined hasta que responda tu llamada<highcharts-chart *ngIf="graficoOptions"[Highcharts]="Highcharts" [options]="graficoOptions"></highcharts-chart>