Browse Source

fix(lib): refine Chart.js tooltip type definitions in line and treemap charts

pull/6264/head
KenTandrian 3 days ago
parent
commit
3843f22d95
  1. 9
      libs/ui/src/lib/line-chart/line-chart.component.ts
  2. 13
      libs/ui/src/lib/treemap-chart/treemap-chart.component.ts

9
libs/ui/src/lib/line-chart/line-chart.component.ts

@ -26,7 +26,6 @@ import {
} from '@angular/core';
import {
Chart,
ChartTypeRegistry,
Filler,
LinearScale,
LineController,
@ -34,8 +33,8 @@ import {
PointElement,
TimeScale,
Tooltip,
TooltipOptions,
TooltipPosition
type TooltipOptions,
type TooltipPosition
} from 'chart.js';
import 'chartjs-adapter-date-fns';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@ -320,9 +319,7 @@ export class GfLineChartComponent
};
}
private getTooltipPluginConfiguration<
T extends keyof ChartTypeRegistry
>(): Partial<TooltipOptions<T>> {
private getTooltipPluginConfiguration(): Partial<TooltipOptions<'line'>> {
return {
...getTooltipOptions({
colorScheme: this.colorScheme,

13
libs/ui/src/lib/treemap-chart/treemap-chart.component.ts

@ -25,7 +25,7 @@ import {
} from '@angular/core';
import { DataSource } from '@prisma/client';
import { Big } from 'big.js';
import { ChartConfiguration } from 'chart.js';
import type { ChartConfiguration, TooltipOptions } from 'chart.js';
import { LinearScale } from 'chart.js';
import { Chart, Tooltip } from 'chart.js';
import { TreemapController, TreemapElement } from 'chartjs-chart-treemap';
@ -294,8 +294,13 @@ export class GfTreemapChartComponent
if (this.chartCanvas) {
if (this.chart) {
this.chart.data = data;
if (!this.chart.options.plugins) {
this.chart.options.plugins = {};
}
this.chart.options.plugins.tooltip =
this.getTooltipPluginConfiguration() as unknown;
this.getTooltipPluginConfiguration();
this.chart.update();
} else {
this.chart = new Chart(this.chartCanvas.nativeElement, {
@ -329,7 +334,7 @@ export class GfTreemapChartComponent
plugins: {
tooltip: this.getTooltipPluginConfiguration()
}
} as unknown,
},
type: 'treemap'
});
}
@ -338,7 +343,7 @@ export class GfTreemapChartComponent
this.isLoading = false;
}
private getTooltipPluginConfiguration() {
private getTooltipPluginConfiguration(): Partial<TooltipOptions<'treemap'>> {
return {
...getTooltipOptions({
colorScheme: this.colorScheme,

Loading…
Cancel
Save