Skip to main content
Module

x/fresh_charts/deps.ts>ChartJs.TooltipOptions

A server-side-rendered charting library for Fresh
denoland/fresh_charts
Go to Latest
interface ChartJs.TooltipOptions
import { type ChartJs } from "https://deno.land/x/fresh_charts@0.2.0/deps.ts";
const { TooltipOptions } = ChartJs;

Type Parameters

optional
TType extends ChartType = ChartType

Properties

enabled: Scriptable<boolean, ScriptableTooltipContext<TType>>

Are on-canvas tooltips enabled?

position: Scriptable<TooltipPositioner, ScriptableTooltipContext<TType>>

The mode for positioning the tooltip

xAlign: Scriptable<TooltipXAlignment, ScriptableTooltipContext<TType>>

Override the tooltip alignment calculations

itemSort: (
data: ChartData,
) => number

Sort tooltip items.

filter: (
index: number,
array: TooltipItem<TType>[],
data: ChartData,
) => boolean
backgroundColor: Scriptable<Color, ScriptableTooltipContext<TType>>

Background color of the tooltip.

boxPadding: number

Padding between the color box and the text.

titleColor: Scriptable<Color, ScriptableTooltipContext<TType>>

Color of title

titleFont: ScriptableAndScriptableOptions<Partial<FontSpec>, ScriptableTooltipContext<TType>> = weight: 'bold'

See Fonts

titleSpacing: Scriptable<number, ScriptableTooltipContext<TType>>

Spacing to add to top and bottom of each title line.

titleMarginBottom: Scriptable<number, ScriptableTooltipContext<TType>>

Margin to add on bottom of title section.

titleAlign: Scriptable<TextAlign, ScriptableTooltipContext<TType>>

Horizontal alignment of the title text lines.

bodySpacing: Scriptable<number, ScriptableTooltipContext<TType>>

Spacing to add to top and bottom of each tooltip item.

bodyColor: Scriptable<Color, ScriptableTooltipContext<TType>>

Color of body

bodyAlign: Scriptable<TextAlign, ScriptableTooltipContext<TType>>

Horizontal alignment of the body text lines.

footerSpacing: Scriptable<number, ScriptableTooltipContext<TType>>

Spacing to add to top and bottom of each footer line.

footerMarginTop: Scriptable<number, ScriptableTooltipContext<TType>>

Margin to add before drawing the footer.

footerColor: Scriptable<Color, ScriptableTooltipContext<TType>>

Color of footer

footerFont: ScriptableAndScriptableOptions<Partial<FontSpec>, ScriptableTooltipContext<TType>> = weight: 'bold'

See Fonts

footerAlign: Scriptable<TextAlign, ScriptableTooltipContext<TType>>

Horizontal alignment of the footer text lines.

padding: Scriptable<Padding, ScriptableTooltipContext<TType>>

Padding to add to the tooltip

caretPadding: Scriptable<number, ScriptableTooltipContext<TType>>

Extra distance to move the end of the tooltip arrow away from the tooltip point.

caretSize: Scriptable<number, ScriptableTooltipContext<TType>>

Size, in px, of the tooltip arrow.

cornerRadius: Scriptable<number | BorderRadius, ScriptableTooltipContext<TType>>

Radius of tooltip corner curves.

multiKeyBackground: Scriptable<Color, ScriptableTooltipContext<TType>>

Color to draw behind the colored boxes when multiple items are in the tooltip.

displayColors: Scriptable<boolean, ScriptableTooltipContext<TType>>

If true, color boxes are shown in the tooltip.

boxWidth: Scriptable<number, ScriptableTooltipContext<TType>>

Width of the color box if displayColors is true.

boxHeight: Scriptable<number, ScriptableTooltipContext<TType>>

Height of the color box if displayColors is true.

usePointStyle: Scriptable<boolean, ScriptableTooltipContext<TType>>

Use the corresponding point style (from dataset options) instead of color boxes, ex: star, triangle etc. (size is based on the minimum value between boxWidth and boxHeight)

borderColor: Scriptable<Color, ScriptableTooltipContext<TType>>

Color of the border.

borderWidth: Scriptable<number, ScriptableTooltipContext<TType>>

Size of the border.

rtl: Scriptable<boolean, ScriptableTooltipContext<TType>>

true for rendering the legends from right to left.

textDirection: Scriptable<string, ScriptableTooltipContext<TType>>

This will force the text direction 'rtl' or 'ltr on the canvas for rendering the tooltips, regardless of the css specified on the canvas

animation: AnimationSpec<TType> | false
animations: AnimationsSpec<TType> | false

Methods

external(this: TooltipModel<TType>, args: { chart: Chart$4; tooltip: TooltipModel<TType>; }): void

See external tooltip section.