archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Improve LegendElement and TooltipItem type definitions (#9376)

Browse Source 
* Document LegendElement properties in TS

* Pass chart type to LegendElement

* Update tooltip item dataset type
This commit is contained in:
Evert Timberg 2021-07-09 06:57:30 -04:00 committed by GitHub
parent 066130be4d
commit ab613a301f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
types/index.esm.d.ts vendored
View File

@ -2120,9 +2120,14 @@ export interface LegendItem {
textAlign?: TextAlign;
}
export interface LegendElement extends Element, LayoutItem {}
export interface LegendElement<TType extends ChartType> extends Element, LayoutItem {
chart: Chart<TType>;
ctx: CanvasRenderingContext2D;
legendItems?: LegendItem[];
options: LegendOptions<TType>;
}
export interface LegendOptions {
export interface LegendOptions<TType extends ChartType> {
/**
* Is the legend shown?
* @default true
@ -2159,15 +2164,15 @@ export interface LegendOptions {
/**
* A callback that is called when a click event is registered on a label item.
*/
onClick(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void;
onClick(this: LegendElement<TType>, e: ChartEvent, legendItem: LegendItem, legend: LegendElement<TType>): void;
/**
* A callback that is called when a 'mousemove' event is registered on top of a label item
*/
onHover(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void;
onHover(this: LegendElement<TType>, e: ChartEvent, legendItem: LegendItem, legend: LegendElement<TType>): void;
/**
* A callback that is called when a 'mousemove' event is registered outside of a previously hovered label item.
*/
onLeave(this: LegendElement, e: ChartEvent, legendItem: LegendItem, legend: LegendElement): void;
onLeave(this: LegendElement<TType>, e: ChartEvent, legendItem: LegendItem, legend: LegendElement<TType>): void;
labels: {
/**
@ -2445,7 +2450,7 @@ export interface ScriptableTooltipContext<TType extends ChartType> {
tooltipItems: TooltipItem<TType>[];
}
export interface TooltipOptions<TType extends ChartType> extends CoreInteractionOptions {
export interface TooltipOptions<TType extends ChartType = ChartType> extends CoreInteractionOptions {
/**
* Are on-canvas tooltips enabled?
* @default true
@ -2469,9 +2474,9 @@ export interface TooltipOptions<TType extends ChartType> extends CoreInteraction
/**
* Sort tooltip items.
*/
itemSort: (a: TooltipItem<ChartType>, b: TooltipItem<ChartType>, data: ChartData) => number;
itemSort: (a: TooltipItem<TType>, b: TooltipItem<TType>, data: ChartData) => number;
filter: (e: TooltipItem<ChartType>, index: number, array: TooltipItem<ChartType>[], data: ChartData) => boolean;
filter: (e: TooltipItem<TType>, index: number, array: TooltipItem<TType>[], data: ChartData) => boolean;
/**
* Background color of the tooltip.
@ -2648,7 +2653,7 @@ export interface TooltipItem<TType extends ChartType> {
/**
* The dataset the item comes from
*/
dataset: ChartDataset;
dataset: UnionToIntersection<ChartDataset<TType>>;
/**
* Index of the dataset the item comes from
@ -2669,7 +2674,7 @@ export interface TooltipItem<TType extends ChartType> {
export interface PluginOptionsByType<TType extends ChartType> {
decimation: DecimationOptions;
filler: FillerOptions;
legend: LegendOptions;
legend: LegendOptions<TType>;
title: TitleOptions;
tooltip: TooltipOptions<TType>;
}

22
types/tests/plugins/plugin.tooltip/tooltip_dataset_type.ts Normal file
View File

@ -0,0 +1,22 @@
import { Chart } from '../../../index.esm';
const chart = new Chart('id', {
type: 'line',
data: {
labels: [],
datasets: [{
data: []
}]
},
options: {
plugins: {
tooltip: {
callbacks: {
label: (item) => {
return `Y Axis ${item.dataset.yAxisID}`;
}
}
}
}
},
});