Skip to content

Class: D3PChart ​

Defined in: core/chart.ts:114

A chart: an svg in a container, with the margins around its plot, a layout for titles and legends, and the services that objects use (the axes, the renderers, the coordinate systems, the interaction area).

Nothing is drawn until objects are attached to it: axes, renderers, tools, a cursor, a tooltip.

Extends ​

  • D3PObject<{ resized: { height: number; width: number; }; }>

Implements ​

Accessors ​

margin ​

Get Signature ​

ts
get margin(): Readonly<D3PMargin>;

Defined in: core/chart.ts:317

The margins, strips of the layout included: where the plot starts, and how much room is left around it.

Returns ​

Readonly<D3PMargin>

Constructors ​

Constructor ​

ts
new D3PChart(opts): D3PChart;

Defined in: core/chart.ts:161

Parameters ​

opts ​

D3PChartOptions

Returns ​

D3PChart

Overrides ​

D3PObject.constructor

Methods ​

destroy() ​

ts
destroy(): void;

Defined in: core/object.ts:51

Detaches the object from all its charts, announces destroyed and releases its subscriptions. The object cannot be used afterwards.

Returns ​

void

Inherited from ​

D3PObject.destroy


downloadPNG() ​

ts
downloadPNG(filename?, scale?): Promise<void>;

Defined in: core/chart.ts:377

Saves the chart as a PNG image, scale times its size. The browser downloads it as filename.

Parameters ​

filename? ​

string = 'chart.png'

scale? ​

number = 2

Returns ​

Promise<void>


downloadSVG() ​

ts
downloadSVG(filename?): void;

Defined in: core/chart.ts:346

Saves the chart as an SVG file. The browser downloads it as filename.

Parameters ​

filename? ​

string = 'chart.svg'

Returns ​

void


emitEvent() ​

ts
emitEvent<K>(name, payload): void;

Defined in: core/chart.ts:259

Emits an event of this chart on its bus (mousemove, wheel, tooltipShow...). Objects listen with chart.event(name).

Type Parameters ​

K ​

K extends keyof D3PChartEventMap

Parameters ​

name ​

K

payload ​

D3PChartEventMap[K]

Returns ​

void


event() ​

Call Signature ​

ts
event<K>(name): D3PEvent<D3PChartEventMap[K]>;

Defined in: core/chart.ts:248

Event owned by this chart and addressed by name (memoized). It lets any module address an event to this chart on a shared bus; its payload type comes from D3PChartEventMap.

Type Parameters ​
K ​

K extends keyof D3PChartEventMap

Parameters ​
name ​

K

Returns ​

D3PEvent<D3PChartEventMap[K]>

Call Signature ​

ts
event<P>(name): D3PEvent<P>;

Defined in: core/chart.ts:249

Event owned by this chart and addressed by name (memoized). It lets any module address an event to this chart on a shared bus; its payload type comes from D3PChartEventMap.

Type Parameters ​
P ​

P = unknown

Parameters ​
name ​

string

Returns ​

D3PEvent<P>


exportPNG() ​

ts
exportPNG(scale?): Promise<string>;

Defined in: core/chart.ts:351

Data URL of a PNG rendering of the chart.

Parameters ​

scale? ​

number = 2

Returns ​

Promise<string>


exportSVG() ​

ts
exportSVG(): string;

Defined in: core/chart.ts:336

The chart as the text of an SVG file.

Returns ​

string


fire() ​

ts
protected fire<P>(event, ...args): void;

Defined in: core/object.ts:41

Emits one of its own events on the bus.

Type Parameters ​

P ​

P

Parameters ​

event ​

D3PEvent<P>

args ​

...P extends void ? [] : [payload: P]

Returns ​

void

Inherited from ​

D3PObject.fire


get() ​

ts
get<T>(key): T | undefined;

Defined in: core/chart.ts:268

The service of that key, or undefined if it was not provided (chart.get(D3P_PROBE)).

Type Parameters ​

T ​

T

Parameters ​

key ​

D3PServiceKey<T>

Returns ​

T | undefined


getRenderTarget() ​

ts
getRenderTarget(): Selection<SVGGElement, unknown, null, undefined>;

Defined in: core/chart.ts:235

Group in which everything is drawn, in inner coordinates.

Returns ​

Selection<SVGGElement, unknown, null, undefined>


getSvg() ​

ts
getSvg(): SVGSVGElement;

Defined in: core/chart.ts:240

The svg element of the chart.

Returns ​

SVGSVGElement


onDestroy() ​

ts
protected onDestroy(): void;

Defined in: core/chart.ts:383

Hook run first on destroy (detach from partners, release DOM...).

Returns ​

void

Overrides ​

D3PObject.onDestroy


provide() ​

ts
provide<T>(key, service): void;

Defined in: core/chart.ts:264

Registers a service under its key, for the other objects of the chart to find.

Type Parameters ​

T ​

T

Parameters ​

key ​

D3PServiceKey<T>

service ​

T

Returns ​

void


relayout() ​

ts
relayout(): void;

Defined in: core/chart.ts:324

Recompute the plot from the size of the chart and its margins, and announce resized.

Returns ​

void


require() ​

ts
require<T>(key): T;

Defined in: core/chart.ts:272

The service of that key. Throws an error if it was not provided.

Type Parameters ​

T ​

T

Parameters ​

key ​

D3PServiceKey<T>

Returns ​

T


resize() ​

ts
resize(width, height): void;

Defined in: core/chart.ts:307

Resize the chart and announce resized. The chart redraws nothing itself: every attached object reacts to the event.

Parameters ​

width ​

number

height ​

number

Returns ​

void

Properties ​

axes ​

ts
readonly axes: D3PAxisManager;

Defined in: core/chart.ts:130

The axes of the chart: add, remove and find them (chart.axes.getXAxis('time')).


baseMargin ​

ts
readonly baseMargin: Readonly<D3PMargin>;

Defined in: core/chart.ts:122

The margin the chart was given (room for the tick labels of the axes).


bus ​

ts
readonly bus: D3PBus;

Defined in: core/object.ts:27

The bus the object uses for its events.

Inherited from ​

D3PObject.bus


container ​

ts
readonly container: Element;

Defined in: core/chart.ts:126

The element the chart was created in.


coords ​

ts
readonly coords: D3PCoordinates;

Defined in: core/chart.ts:132

The coordinate systems of the chart (cartesian by default, polar if asked).


defs ​

ts
readonly defs: Selection<SVGDefsElement, unknown, null, undefined>;

Defined in: core/chart.ts:155

The <defs> of the svg: coordinate systems register their own clip paths there.


e ​

ts
readonly e: D3PEventTable<M & object>;

Defined in: core/object.ts:29

The events of the object, by name: destroyed for all, and its own (axis.e.scaleChanged).

Inherited from ​

D3PObject.e


height ​

ts
height: number;

Defined in: core/chart.ts:141

Height of the chart in pixels, margins included.


id ​

ts
readonly id: number = ++D3PChart.counter;

Defined in: core/chart.ts:118

A number that identifies the chart: 1 for the first one created.


innerHeight ​

ts
innerHeight: number;

Defined in: core/chart.ts:145

Height of the plot in pixels: the chart without its margins.


innerWidth ​

ts
innerWidth: number;

Defined in: core/chart.ts:143

Width of the plot in pixels: the chart without its margins.


isDestroying ​

ts
isDestroying: boolean = false;

Defined in: core/object.ts:31

Set when destroy starts: the object is not drawn after that.

Implementation of ​

D3PRenderTarget.isDestroying

Inherited from ​

D3PObject.isDestroying


layer ​

ts
readonly layer: D3PChartLayers;

Defined in: core/chart.ts:136

The groups of the svg that objects draw in.


layout ​

ts
readonly layout: D3PLayout;

Defined in: core/chart.ts:124

The room around the plot: titles, legends... reserve strips of it.


name ​

ts
readonly name: string;

Defined in: core/chart.ts:120

The name of the chart.


plotClip ​

ts
readonly plotClip: string;

Defined in: core/chart.ts:152

url(#id) of the clip path of the plot area: what is drawn with it does not go out of the plot.


renderers ​

ts
readonly renderers: D3PSeriesRendererManager;

Defined in: core/chart.ts:134

The series renderers of the chart.


services ​

ts
readonly services: D3PServiceRegistry;

Defined in: core/chart.ts:128

The services of the chart (axes, renderers, coordinate systems, interaction area, probe...).


subs ​

ts
protected readonly subs: D3PSubscriptions;

Defined in: core/object.ts:33

The subscriptions of the object, released when it is destroyed.

Inherited from ​

D3PObject.subs


width ​

ts
width: number;

Defined in: core/chart.ts:139

Width of the chart in pixels, margins included.