Hey there! I'm having trouble getting my chart to show up after adding routing to my 3 tabs. Previously, without routing, everything worked fine. Now, the graph only appears after resizing the window. The chart is using PrimeNG chart with the Chart.js library. You can find more information about it here.
Here's the TypeScript code for the chart:
export class ChartComponent implements OnInit, OnDestroy {
showError: string;
basicData: { labels: string[]; datasets: Dataset[] } = {
labels: [],
datasets: [],
};
private componentDestroyed$: Subject<boolean> = new Subject();
weatherDataLoading: boolean;
constructor(
private weatherService: WeatherService,
public datePipe: DatePipe
) {}
// ngOnInit(), ngOnDestroy(), and subscribing to data...
}
And here's the HTML code for the chart:
<div class="card">
<div *ngIf="weatherDataLoading" class="load-container">
<div class="load-speeding-wheel"></div>
</div>
<p-chart type="line" height="80vh" [data]="basicData"></p-chart>
</div>
Additionally, here's a snippet of the service function:
// getWeatherDataForChart() implementation...