@coreui/angular-chartjs
Version:
Angular wrapper component for Chart.js
105 lines (100 loc) • 6.69 kB
TypeScript
import * as node_modules_chart_js_dist_types_basic from 'node_modules/chart.js/dist/types/basic';
import * as node_modules_chart_js_dist_types_utils from 'node_modules/chart.js/dist/types/utils';
import * as chart_js from 'chart.js';
import { ChartData, Plugin, InteractionItem, Chart, ChartConfiguration } from 'chart.js';
import * as _angular_core from '@angular/core';
import { OnDestroy, OnChanges, ElementRef, SimpleChanges } from '@angular/core';
declare type BooleanInput = string | boolean | null | undefined;
declare class ChartjsComponent implements OnDestroy, OnChanges {
static ngAcceptInputType_redraw: BooleanInput;
private readonly ngZone;
private readonly renderer;
private readonly changeDetectorRef;
/**
* Enables custom html based tooltips instead of standard tooltips.
* @return boolean
* @default true
*/
readonly customTooltips: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* The data object that is passed into the Chart.js chart (more info).
*/
readonly data: _angular_core.InputSignal<ChartData<keyof chart_js.ChartTypeRegistry, (number | [number, number] | chart_js.Point | chart_js.BubbleDataPoint | null)[], unknown> | undefined>;
/**
* A fallback when the canvas cannot be rendered. Can be used for accessible chart descriptions.
*/
/**
* Height attribute applied to the rendered canvas.
* @return number | undefined
* @default null
*/
readonly height: _angular_core.InputSignalWithTransform<number | null, unknown>;
/**
* ID attribute applied to the rendered canvas.
* @return string
*/
readonly idInput: _angular_core.InputSignal<string>;
get id(): string;
/**
* The options object that is passed into the Chart.js chart.
*/
readonly optionsInput: _angular_core.InputSignal<node_modules_chart_js_dist_types_utils._DeepPartialObject<chart_js.CoreChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ElementChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.PluginChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.DatasetChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ScaleChartOptions<keyof chart_js.ChartTypeRegistry>> | undefined>;
readonly options: _angular_core.WritableSignal<node_modules_chart_js_dist_types_utils._DeepPartialObject<chart_js.CoreChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ElementChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.PluginChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.DatasetChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ScaleChartOptions<keyof chart_js.ChartTypeRegistry>> | undefined>;
/**
* The plugins array that is passed into the Chart.js chart
*/
readonly plugins: _angular_core.InputSignal<Plugin<keyof chart_js.ChartTypeRegistry, node_modules_chart_js_dist_types_basic.AnyObject>[]>;
/**
* If true, will tear down and redraw chart on all updates.
* @return boolean
* @default false
*/
readonly redraw: _angular_core.InputSignalWithTransform<boolean, unknown>;
/**
* Chart.js chart type.
* @return {'line' | 'bar' | 'radar' | 'doughnut' | 'polarArea' | 'bubble' | 'pie' | 'scatter'}
*/
readonly type: _angular_core.InputSignal<keyof chart_js.ChartTypeRegistry>;
/**
* Width attribute applied to the rendered canvas.
* @return number | undefined
* @default null
*/
readonly width: _angular_core.InputSignalWithTransform<number | null, unknown>;
/**
* Put the chart into the wrapper div element.
* @default true
*/
readonly wrapper: _angular_core.InputSignalWithTransform<boolean, unknown>;
readonly getDatasetAtEvent: _angular_core.OutputEmitterRef<InteractionItem[]>;
readonly getElementAtEvent: _angular_core.OutputEmitterRef<InteractionItem[]>;
readonly getElementsAtEvent: _angular_core.OutputEmitterRef<InteractionItem[]>;
readonly chartRef: _angular_core.OutputEmitterRef<any>;
readonly canvasElement: _angular_core.Signal<ElementRef<any>>;
chart: Chart;
ctx: CanvasRenderingContext2D;
readonly hostClasses: _angular_core.Signal<{
'chart-wrapper': boolean;
}>;
constructor();
ngOnChanges(changes: SimpleChanges): void;
ngOnDestroy(): void;
handleClick($event: MouseEvent): void;
chartDestroy(): void;
chartRender(): void;
chartUpdate(): void;
private chartUpdateOutsideAngular;
chartToBase64Image(): string | undefined;
private chartDataConfig;
readonly chartOptions: _angular_core.Signal<node_modules_chart_js_dist_types_utils._DeepPartialObject<chart_js.CoreChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ElementChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.PluginChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.DatasetChartOptions<keyof chart_js.ChartTypeRegistry> & chart_js.ScaleChartOptions<keyof chart_js.ChartTypeRegistry>>>;
readonly chartConfig: _angular_core.Signal<ChartConfiguration<keyof chart_js.ChartTypeRegistry, (number | [number, number] | chart_js.Point | chart_js.BubbleDataPoint | null)[], unknown>>;
private chartCustomTooltips;
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartjsComponent, never>;
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ChartjsComponent, "c-chart", ["cChart"], { "customTooltips": { "alias": "customTooltips"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "idInput": { "alias": "id"; "required": false; "isSignal": true; }; "optionsInput": { "alias": "options"; "required": false; "isSignal": true; }; "plugins": { "alias": "plugins"; "required": false; "isSignal": true; }; "redraw": { "alias": "redraw"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "wrapper": { "alias": "wrapper"; "required": false; "isSignal": true; }; }, { "getDatasetAtEvent": "getDatasetAtEvent"; "getElementAtEvent": "getElementAtEvent"; "getElementsAtEvent": "getElementsAtEvent"; "chartRef": "chartRef"; }, never, ["*"], true, never>;
}
declare class ChartjsModule {
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ChartjsModule, never>;
static ɵmod: _angular_core.ɵɵNgModuleDeclaration<ChartjsModule, never, [typeof ChartjsComponent], [typeof ChartjsComponent]>;
static ɵinj: _angular_core.ɵɵInjectorDeclaration<ChartjsModule>;
}
export { ChartjsComponent, ChartjsModule };