readonly id: string;
readonly canvas: HTMLCanvasElement;
readonly ctx: CanvasRenderingContext2D;
- readonly config: ChartConfiguration<TType, TData, TLabel> | ChartConfigurationCustomTypesPerDataset<TType, TData, TLabel>;
+ readonly config: ChartConfigurationInstance;
readonly width: number;
readonly height: number;
readonly aspectRatio: number;
readonly scales: { [key: string]: Scale };
readonly attached: boolean;
- readonly legend?: LegendElement<TType>; // Only available if legend plugin is registered and enabled
- readonly tooltip?: TooltipModel<TType>; // Only available if tooltip plugin is registered and enabled
+ readonly legend?: LegendElement; // Only available if legend plugin is registered and enabled
+ readonly tooltip?: TooltipModel; // Only available if tooltip plugin is registered and enabled
- data: ChartData<TType, TData, TLabel>;
- options: ChartOptions<TType>;
+ data: ChartData;
+ options: ChartOptions;
constructor(item: ChartItem, config: ChartConfiguration<TType, TData, TLabel> | ChartConfigurationCustomTypesPerDataset<TType, TData, TLabel>);
textAlign?: TextAlign;
}
-export interface LegendElement<TType extends ChartType> extends Element<AnyObject, LegendOptions<TType>>, LayoutItem {
+export interface LegendElement<TType extends ChartType = ChartType> extends Element<AnyObject, LegendOptions<TType>>, LayoutItem {
chart: Chart<TType>;
ctx: CanvasRenderingContext2D;
legendItems?: LegendItem[];
*/
borderRadius?: number | BorderRadius;
}
-export interface TooltipModel<TType extends ChartType> extends Element<AnyObject, TooltipOptions<TType>> {
+export interface TooltipModel<TType extends ChartType = ChartType> extends Element<AnyObject, TooltipOptions<TType>> {
readonly chart: Chart<TType>;
// The items that we are rendering in the tooltip. See Tooltip Item Interface section
options?: ChartOptions<TType>;
plugins?: Plugin<TType>[];
}
+
+export type ChartConfigurationInstance = ChartConfiguration | ChartConfigurationCustomTypesPerDataset & { type?: undefined }
--- /dev/null
+import { Chart } from '../../src/types.js';
+
+const chart = new Chart('chart', {
+ type: 'bar',
+ data: {
+ labels: ['1', '2', '3'],
+ datasets: [{
+ data: [1, 2, 3]
+ },
+ {
+ data: [1, 2, 3]
+ }],
+ }
+});
+
+chart.config.type = 'line';
+
+const chart2 = new Chart('chart', {
+ type: 'bar',
+ data: {
+ labels: ['1', '2', '3'],
+ datasets: [{
+ type: 'line',
+ data: [1, 2, 3]
+ },
+ {
+ type: 'line',
+ data: [1, 2, 3]
+ }],
+ }
+});
+
+chart2.config.type = 'line';
+
+const chart3 = new Chart('chart', {
+ data: {
+ labels: ['1', '2', '3'],
+ datasets: [{
+ type: 'bar',
+ data: [1, 2, 3]
+ },
+ {
+ type: 'bar',
+ data: [1, 2, 3],
+ categoryPercentage: 10
+ }],
+ }
+});
+
+chart3.config.type = 'line';
+
+const chart4 = new Chart('chart', {
+ data: {
+ labels: ['1', '2', '3'],
+ datasets: [{
+ type: 'bar',
+ data: [1, 2, 3]
+ }]
+ }
+});
+
+chart4.data.datasets.push({
+ type: 'line',
+ data: [1, 2, 3]
+});