@d3plus/types

v3.1.0

Published

2 days ago

TypeScript type definitions for d3plus.

0High
0Medium
0Low

davelandry

d3plus types typescript definitions

@d3plus/types

TypeScript type definitions for d3plus.

Installing

If using npm, npm install @d3plus/types. Otherwise, you can download the latest release from GitHub or load from a CDN.

import {*} from "@d3plus/types";

In a vanilla environment, a d3plus global is exported from the pre-bundled version:

<script src="https://cdn.jsdelivr.net/npm/@d3plus/types"></script>
<script>
  console.log(d3plus);
</script>

Examples

Live examples can be found on d3plus.org, which includes a collection of example visualizations using @d3plus/react.

API Reference

| Classes | Description | | --- | --- | | Area | Creates SVG areas based on an array of data. | | AreaPlot | Creates an area plot based on an array of data. | | Axis | Creates an SVG scale based on an array of data. | | AxisBottom | Shorthand method for creating an axis where the ticks are drawn below the horizontal domain path. Extends all functional | | AxisLeft | Shorthand method for creating an axis where the ticks are drawn to the left of the vertical domain path. Extends all fun | | AxisRight | Shorthand method for creating an axis where the ticks are drawn to the right of the vertical domain path. Extends all fu | | AxisTop | Shorthand method for creating an axis where the ticks are drawn above the vertical domain path. Extends all functionalit | | Bar | Creates SVG areas based on an array of data. | | BarChart | Creates a bar chart based on an array of data. | | BaseClass | Provides shared configuration, event handling, and locale management inherited by all d3plus classes. | | Box | Creates SVG box based on an array of data. | | BoxWhisker | Creates a simple box and whisker based on an array of data. | | BumpChart | Creates a bump chart based on an array of data. | | Circle | Creates SVG circles based on an array of data. | | ColorScale | Creates an SVG color scale based on an array of data. | | Donut | Extends the Pie visualization to create a donut chart. | | Geomap | Creates a geographical map with zooming, panning, image tiles, and the ability to layer choropleth paths and coordinate | | Image | Creates SVG images based on an array of data. | | Legend | Creates an SVG legend based on an array of data. | | Line | Creates SVG lines based on an array of data. | | LinePlot | Creates a line plot based on an array of data. | | Matrix | Creates a simple rows/columns Matrix view of any dataset. See [this example](https://d3plus.org/examples/d3plus-matrix/g | | Network | Creates a network visualization based on a defined set of nodes and edges. [Click here](http://d3plus.org/examples/d3plu | | Pack | Uses the d3 pack layout to creates Circle Packing chart based on an array of | | Path | Creates SVG Paths based on an array of data. | | Pie | Uses the d3 pie layout to creates SVG arcs based on an array of data. | | Plot | Creates an x/y plot based on an array of data. | | Priestley | Creates a priestley timeline based on an array of data. | | Radar | Creates a radar visualization based on an array of data. | | RadialMatrix | Creates a radial layout of a rows/columns Matrix of any dataset. See [this example](https://d3plus.org/examples/d3plus-m | | Rect | Creates SVG rectangles based on an array of data. See [this example](https://d3plus.org/examples/d3plus-shape/getting-st | | Rings | Creates a ring visualization based on a defined set of nodes and edges. [Click here](http://d3plus.org/examples/d3plus-n | | Sankey | Creates a sankey visualization based on a defined set of nodes and links. [Click here](http://d3plus.org/examples/d3plus | | Shape | An abstracted class for generating shapes. | | StackedArea | Creates a stacked area plot based on an array of data. | | TextBox | Creates a wrapped text box for each point in an array of data. See [this example](https://d3plus.org/examples/d3plus-tex | | Timeline | Creates an interactive timeline brush component for selecting time periods within a visualization. | | Tooltip | Creates HTML tooltips in the body of a webpage. | | Tree | Uses d3's tree layout to create a tidy tree chart based on an array of data. | | Treemap | Uses the d3 treemap layout to creates SVG rectangles based on an a | | Viz | Creates an x/y plot based on an array of data. See [this example](https://d3plus.org/examples/d3plus-treemap/getting-sta | | Whisker | Creates SVG whisker based on an array of data. |

| Functions | Description | | --- | --- | | accessor | Wraps an object key in a simple accessor function. | | addToQueue | Adds the provided value to the internal queue to be loaded, if necessary. This is used internally in new d3plus visualiz | | assign | A deeply recursive version of Object.assign. | | attrize | Applies each key/value in an object as an attr. | | backgroundColor | Given a DOM element, returns its background color by walking up the | | closest | Finds the closest numeric value in an array. | | colorAdd | Adds two colors together. | | colorAssign | Assigns a color to a value using a predefined set of defaults. | | colorContrast | A set of default color values used when assigning colors based on data. | | colorLegible | Darkens a color so that it will appear legible on a white background. | | colorLighter | Similar to d3.color.brighter, except that this also reduces saturation so that colors don't appear neon. | | colorSubtract | Subtracts one color from another. | | concat | Reduce and concat all the elements included in arrayOfArrays if they are arrays. If it is a JSON object try to concat th | | configPrep | Preps a config object for d3plus data, and optionally bubbles up a specific nested type. When using this function, you m | | constant | Wraps non-function variables in a simple return function. | | date | Parses numbers and strings into valid JavaScript Date objects, supporting years, quarters, months, and ISO 8601 formats. | | elem | Manages the enter/update/exit pattern for a single DOM element, applying enter, update, and exit attributes with optiona | | findLocale | Converts a 2-letter language code into a full language-region locale string (e.g., "en" to "en-US"). | | fold | Given a JSON object where the data values and headers have been split into separate key lookups, this function will comb | | fontFamilyStringify | Converts an Array of font-family names into a CSS font-family string. | | format | | | formatAbbreviate | Formats a number to an appropriate number of decimal places and rounding, adding suffixes if applicable (ie. 1200000 t | | formatDate | A default set of date formatters, which takes into account both the interval in between in each data point but also the | | formatDefaultLocale | An extension to d3's formatDefaultLocale function that allows setting t | | inViewport | Determines whether a given DOM element is visible within the current viewport, with an optional pixel buffer. | | isData | Returns true/false whether the argument provided to the function should be loaded using an internal XHR request. Valid d | | isObject | Detects if a variable is a javascript Object. | | largestRect | Finds the largest rectangle that fits inside a given polygon, optimizing for area across configurable rotations and aspe | | lineIntersection | Finds the intersection point (if there is one) of the lines p1q1 and p2q2. | | load | Loads data from a filepath or URL, converts it to a valid JSON object, and returns it to a callback function. | | merge | Combines an Array of Objects together and returns a new Object. | | nestGroups | Recursively groups data by each key function, producing {key, values} objects compatible with d3-hierarchy. | | parseSides | Converts a string of directional CSS shorthand values into an object with the values expanded. | | path2polygon | Transforms a path string into an Array of points. | | pointDistance | Calculates the pixel distance between two points. | | pointDistanceSquared | Returns the squared euclidean distance between two points. | | pointRotate | Rotates a point around a given origin. | | polygonInside | Checks if one polygon is inside another polygon. | | polygonRayCast | Gives the two closest intersection points between a ray cast from a point inside a polygon. The two points should lie on | | polygonRotate | Rotates a point around a given origin. | | rtl | Returns true if the HTML or body element has either the "dir" HTML attribute or the "direction" CSS property set to "r | | saveElement | Downloads an HTML Element as a bitmap PNG image. | | segmentBoxContains | Checks whether a point is inside the bounding box of a line segment. | | segmentsIntersect | Checks whether the line segments p1q1 && p2q2 intersect. | | shapeEdgePoint | Calculates the x/y position of a point at the edge of a shape, from the center of the shape, given a specified pixel dis | | simplify | Simplifies the points of a polygon using both the Ramer-Douglas-Peucker algorithm and basic distance-based simplificatio | | strip | Removes all non ASCII characters from a string. | | stylize | Applies each key/value in an object as a style. | | textSplit | Splits a given sentence into an array of words. | | textWidth | Given a text string, returns the predicted pixel width of the string when placed into DOM. | | textWrap | Based on the defined styles and dimensions, breaks a string into an array of strings for each line of text. | | titleCase | Capitalizes the first letter of each word in a phrase/sentence, accounting for words in English that should be kept lowe | | unique | ES5 implementation to reduce an Array of values to unique instances. |

| Variables | Description | | --- | --- | | colorDefaults | A set of default color values used when assigning colors based on data. | | D3plusContext | A React context instance used to provide global config options via a provider (D3plusContext.Provider). | | fontExists | Given either a single font-family or a list of fonts, returns the name of the first font that can be rendered, or false | | [fontFamily](#fontfamily) | The default fallback font list used for all text labels as an Array of Strings. | | [formatLocale](#formatlocale) | | | [locale](#locale) | | | [RESET](#reset) | String constant used to reset an individual config property. | | [translateLocale`](#translatelocale) | |

| Interfaces | Description | | --- | --- | | AxisConfig | | | ColorDefaults | | | D3plusConfig | | | DataPoint | DataPoint | | FormatLocaleDefinition | formatLocale | | MergedDataPoint | | | RendererProps | Props accepted by the Renderer component. | | TimeLocaleDefinition | | | TooltipConfig | | | TranslationStrings | |

| Type Aliases | Description | | --- | --- | | D3plusComponentProps | Props for d3plus React wrapper components (omits the internal constructor prop). | | D3plusConstructor | Constructor type for d3plus visualization classes. | | D3Selection | |

Classes

Area

Defined in: core/types/src/shapes/Area.d.ts:7

Creates SVG areas based on an array of data.

Extends

Shape

Methods

active()

Call Signature

active(): ((d: DataPoint, i: number) => boolean) | null

Defined in: core/types/src/shapes/Shape.d.ts:148

The active callback function for highlighting shapes.

Returns

((d: DataPoint, i: number) => boolean) | null

Inherited from

Shape.active

Call Signature

active(_: ((d: DataPoint, i: number) => boolean) | null): this

Defined in: core/types/src/shapes/Shape.d.ts:149

The active callback function for highlighting shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | ((d: DataPoint, i: number) => boolean) | null |

Returns

this

Inherited from

Shape.active

activeOpacity()

Call Signature

activeOpacity(): number

Defined in: core/types/src/shapes/Shape.d.ts:153

When shapes are active, this is the opacity of any shape that is not active.

Returns

number

Inherited from

Shape.activeOpacity

Call Signature

activeOpacity(_: number): this

Defined in: core/types/src/shapes/Shape.d.ts:154

When shapes are active, this is the opacity of any shape that is not active.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number |

Returns

this

Inherited from

Shape.activeOpacity

activeStyle()

Call Signature

activeStyle(): Record<string, unknown>

Defined in: core/types/src/shapes/Shape.d.ts:158

The style to apply to active shapes.

Returns

Record<string, unknown>

Inherited from

Shape.activeStyle

Call Signature

activeStyle(_: Record<string, unknown>): this

Defined in: core/types/src/shapes/Shape.d.ts:159

The style to apply to active shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> |

Returns

this

Inherited from

Shape.activeStyle

ariaLabel()

Call Signature

ariaLabel(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:163

The aria-label attribute for each shape.

Returns

AccessorFn

Inherited from

Shape.ariaLabel

Call Signature

ariaLabel(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:164

The aria-label attribute for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.ariaLabel

backgroundImage()

Call Signature

backgroundImage(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:168

The background-image accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.backgroundImage

Call Signature

backgroundImage(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:169

The background-image accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.backgroundImage

config()

Call Signature

config(): D3plusConfig

Defined in: core/types/src/utils/BaseClass.d.ts:21

Methods that correspond to the key/value pairs and returns this class.

Returns

D3plusConfig

Inherited from

Shape.config

Call Signature

config(_: D3plusConfig): this

Defined in: core/types/src/utils/BaseClass.d.ts:22

Methods that correspond to the key/value pairs and returns this class.

Parameters

| Parameter | Type | | ------ | ------ | | _ | D3plusConfig |

Returns

this

Inherited from

Shape.config

curve()

Call Signature

curve(): AccessorFn

Defined in: core/types/src/shapes/Area.d.ts:44

The d3 curve function used to interpolate the area.

Returns

AccessorFn

Call Signature

curve(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Area.d.ts:45

The d3 curve function used to interpolate the area.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

data()

Call Signature

data(): DataPoint[]

Defined in: core/types/src/shapes/Shape.d.ts:173

The data array used to create shapes. A shape will be drawn for each object in the array.

Returns

DataPoint[]

Inherited from

Shape.data

Call Signature

data(_: DataPoint[]): this

Defined in: core/types/src/shapes/Shape.d.ts:174

The data array used to create shapes. A shape will be drawn for each object in the array.

Parameters

| Parameter | Type | | ------ | ------ | | _ | DataPoint[] |

Returns

this

Inherited from

Shape.data

defined()

Call Signature

defined(): (d: DataPoint) => boolean

Defined in: core/types/src/shapes/Area.d.ts:49

An accessor function that determines whether a data point is defined (not a gap in the area).

Returns

(d: DataPoint) => boolean

Call Signature

defined(_: (d: DataPoint) => boolean): this

Defined in: core/types/src/shapes/Area.d.ts:50

An accessor function that determines whether a data point is defined (not a gap in the area).

Parameters

| Parameter | Type | | ------ | ------ | | _ | (d: DataPoint) => boolean |

Returns

this

discrete()

Call Signature

discrete(): string | undefined

Defined in: core/types/src/shapes/Shape.d.ts:178

Determines if either the X or Y position is discrete along a Line, which helps in determining the nearest data point on a line for a hit area event.

Returns

string | undefined

Inherited from

Shape.discrete

Call Signature

discrete(_: string): this

Defined in: core/types/src/shapes/Shape.d.ts:179

Determines if either the X or Y position is discrete along a Line, which helps in determining the nearest data point on a line for a hit area event.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string |

Returns

this

Inherited from

Shape.discrete

duration()

Call Signature

duration(): number

Defined in: core/types/src/shapes/Shape.d.ts:183

The animation duration in milliseconds.

Returns

number

Inherited from

Shape.duration

Call Signature

duration(_: number): this

Defined in: core/types/src/shapes/Shape.d.ts:184

The animation duration in milliseconds.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number |

Returns

this

Inherited from

Shape.duration

fill()

Call Signature

fill(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:188

The fill color accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.fill

Call Signature

fill(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:189

The fill color accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.fill

fillOpacity()

Call Signature

fillOpacity(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:193

Defines the "fill-opacity" attribute for the shapes.

Returns

AccessorFn

Inherited from

Shape.fillOpacity

Call Signature

fillOpacity(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:194

Defines the "fill-opacity" attribute for the shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.fillOpacity

hitArea()

Call Signature

hitArea(): ((d: DataPoint, i: number, aes: Record<string, unknown>) => Record<string, unknown>) | null

Defined in: core/types/src/shapes/Shape.d.ts:222

The mouse hit area accessor function.

Returns

((d: DataPoint, i: number, aes: Record<string, unknown>) => Record<string, unknown>) | null

Example

function(d, i, shape) {
return {
"width": shape.width,
"height": shape.height,
"x": -shape.width / 2,
"y": -shape.height / 2
};
}

Inherited from

Shape.hitArea

Call Signature

hitArea(_: Record<string, unknown> | ((d: DataPoint, i: number, aes: Record<string, unknown>) => Record<string, unknown>)): this

Defined in: core/types/src/shapes/Shape.d.ts:223

The mouse hit area accessor function.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> | ((d: DataPoint, i: number, aes: Record<string, unknown>) => Record<string, unknown>) |

Returns

this

Example

function(d, i, shape) {
return {
"width": shape.width,
"height": shape.height,
"x": -shape.width / 2,
"y": -shape.height / 2
};
}

Inherited from

Shape.hitArea

hover()

Call Signature

hover(): ((d: DataPoint, i: number) => boolean) | null

Defined in: core/types/src/shapes/Shape.d.ts:198

The hover callback function for highlighting shapes on mouseover.

Returns

((d: DataPoint, i: number) => boolean) | null

Inherited from

Shape.hover

Call Signature

hover(_: ((d: DataPoint, i: number) => boolean) | null): this

Defined in: core/types/src/shapes/Shape.d.ts:199

The hover callback function for highlighting shapes on mouseover.

Parameters

| Parameter | Type | | ------ | ------ | | _ | ((d: DataPoint, i: number) => boolean) | null |

Returns

this

Inherited from

Shape.hover

hoverOpacity()

Call Signature

hoverOpacity(): number

Defined in: core/types/src/shapes/Shape.d.ts:208

The opacity of non-hovered shapes when any shape is hovered.

Returns

number

Inherited from

Shape.hoverOpacity

Call Signature

hoverOpacity(_: number): this

Defined in: core/types/src/shapes/Shape.d.ts:209

The opacity of non-hovered shapes when any shape is hovered.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number |

Returns

this

Inherited from

Shape.hoverOpacity

hoverStyle()

Call Signature

hoverStyle(): Record<string, unknown>

Defined in: core/types/src/shapes/Shape.d.ts:203

The style to apply to hovered shapes.

Returns

Record<string, unknown>

Inherited from

Shape.hoverStyle

Call Signature

hoverStyle(_: Record<string, unknown>): this

Defined in: core/types/src/shapes/Shape.d.ts:204

The style to apply to hovered shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> |

Returns

this

Inherited from

Shape.hoverStyle

id()

Call Signature

id(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:227

The unique id accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.id

Call Signature

id(_: AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:228

The unique id accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | AccessorFn |

Returns

this

Inherited from

Shape.id

label()

Call Signature

label(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:232

The text label accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.label

Call Signature

label(_: string | string[] | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:233

The text label accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | string[] | AccessorFn |

Returns

this

Inherited from

Shape.label

labelBounds()

Call Signature

labelBounds(): ((d: DataPoint, i: number, aes: Record<string, unknown>) => false | Record<string, unknown> | null) | null

Defined in: core/types/src/shapes/Shape.d.ts:246

The label bounds accessor function.

Returns

((d: DataPoint, i: number, aes: Record<string, unknown>) => false | Record<string, unknown> | null) | null

Example

function(d, i, shape) {
return {
"width": shape.width,
"height": shape.height,
"x": -shape.width / 2,
"y": -shape.height / 2
};
}

Inherited from

Shape.labelBounds

Call Signature

labelBounds(_: Record<string, unknown> | ((d: DataPoint, i: number, aes: Record<string, unknown>) => false | Record<string, unknown> | null)): this

Defined in: core/types/src/shapes/Shape.d.ts:247

The label bounds accessor function.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> | ((d: DataPoint, i: number, aes: Record<string, unknown>) => false | Record<string, unknown> | null) |

Returns

this

Example

function(d, i, shape) {
return {
"width": shape.width,
"height": shape.height,
"x": -shape.width / 2,
"y": -shape.height / 2
};
}

Inherited from

Shape.labelBounds

labelConfig()

Call Signature

labelConfig(): Record<string, unknown>

Defined in: core/types/src/shapes/Shape.d.ts:251

A pass-through to the config method of the TextBox class used to create a shape's labels.

Returns

Record<string, unknown>

Inherited from

Shape.labelConfig

Call Signature

labelConfig(_: Record<string, unknown>): this

Defined in: core/types/src/shapes/Shape.d.ts:252

A pass-through to the config method of the TextBox class used to create a shape's labels.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> |

Returns

this

Inherited from

Shape.labelConfig

locale()

Call Signature

locale(): string

Defined in: core/types/src/utils/BaseClass.d.ts:38

The locale used for all text and number formatting. Supports the locales defined in d3plus-format. The locale can be a complex Object, a locale code (like "en-US"), or a 2-digit language code (like "en"). If a 2-digit code is provided, the "findLocale" function is used to identify the most approximate locale.

Returns

string

Example

{
          separator: "",
          suffixes: ["y", "z", "a", "f", "p", "n", "\u00b5", "m", "", "k", "M", "B", "t", "q", "Q", "Z", "Y"],
          grouping: [3],
          delimiters: {
            thousands: ",",
            decimal: "."
          },
          currency: ["$", ""]
        }

Inherited from

Shape.locale

Call Signature

locale(_: string | object): this

Defined in: core/types/src/utils/BaseClass.d.ts:39

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | object |

Returns

this

Example

{
          separator: "",
          suffixes: ["y", "z", "a", "f", "p", "n", "\u00b5", "m", "", "k", "M", "B", "t", "q", "Q", "Z", "Y"],
          grouping: [3],
          delimiters: {
            thousands: ",",
            decimal: "."
          },
          currency: ["$", ""]
        }

Inherited from

Shape.locale

on()

Call Signature

on(): Record<string, (...args: unknown[]) => unknown>

Defined in: core/types/src/utils/BaseClass.d.ts:52

Event listener for the specified event typenames. Mirrors the core d3-selection behavior.

Returns

Record<string, (...args: unknown[]) => unknown>

Example

new Plot
.on("click.Shape", function(d) {
console.log("data for shape clicked:", d);
})
.on("click.Legend", function(d) {
console.log("data for legend clicked:", d);
})

Inherited from

Shape.on

Call Signature

on(_: string): ((...args: unknown[]) => unknown) | undefined

Defined in: core/types/src/utils/BaseClass.d.ts:53

Event listener for the specified event typenames. Mirrors the core d3-selection behavior.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string |

Returns

((...args: unknown[]) => unknown) | undefined

Example

new Plot
.on("click.Shape", function(d) {
console.log("data for shape clicked:", d);
})
.on("click.Legend", function(d) {
console.log("data for legend clicked:", d);
})

Inherited from

Shape.on

Call Signature

on(_: string, f: (...args: unknown[]) => unknown): this

Defined in: core/types/src/utils/BaseClass.d.ts:54

Event listener for the specified event typenames. Mirrors the core d3-selection behavior.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | | f | (...args: unknown[]) => unknown |

Returns

this

Example

new Plot
.on("click.Shape", function(d) {
console.log("data for shape clicked:", d);
})
.on("click.Legend", function(d) {
console.log("data for legend clicked:", d);
})

Inherited from

Shape.on

Call Signature

on(_: Record<string, (...args: unknown[]) => unknown>): this

Defined in: core/types/src/utils/BaseClass.d.ts:55

Event listener for the specified event typenames. Mirrors the core d3-selection behavior.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, (...args: unknown[]) => unknown> |

Returns

this

Example

new Plot
.on("click.Shape", function(d) {
console.log("data for shape clicked:", d);
})
.on("click.Legend", function(d) {
console.log("data for legend clicked:", d);
})

Inherited from

Shape.on

opacity()

Call Signature

opacity(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:256

The opacity accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.opacity

Call Signature

opacity(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:257

The opacity accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.opacity

parent()

Call Signature

parent(): Record<string, unknown>

Defined in: core/types/src/utils/BaseClass.d.ts:59

Parent config used by the wrapper.

Returns

Record<string, unknown>

Inherited from

Shape.parent

Call Signature

parent(_: Record<string, unknown>): this

Defined in: core/types/src/utils/BaseClass.d.ts:60

Parent config used by the wrapper.

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> |

Returns

this

Inherited from

Shape.parent

pointerEvents()

Call Signature

pointerEvents(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:261

The pointer-events CSS property for each shape.

Returns

AccessorFn

Inherited from

Shape.pointerEvents

Call Signature

pointerEvents(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:262

The pointer-events CSS property for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.pointerEvents

render()

render(callback?: () => void): this

Defined in: core/types/src/shapes/Area.d.ts:40

Draws the area polygons.

Parameters

| Parameter | Type | Description | | ------ | ------ | ------ | | callback? | () => void | Optional callback invoked after rendering completes. |

Returns

this

Overrides

Shape.render

role()

Call Signature

role(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:266

The role attribute.

Returns

AccessorFn

Inherited from

Shape.role

Call Signature

role(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:267

The role attribute.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.role

rotate()

Call Signature

rotate(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:271

The rotation angle in degrees for each shape.

Returns

AccessorFn

Inherited from

Shape.rotate

Call Signature

rotate(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:272

The rotation angle in degrees for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.rotate

rx()

Call Signature

rx(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:276

Defines the "rx" attribute for the shapes.

Returns

AccessorFn

Inherited from

Shape.rx

Call Signature

rx(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:277

Defines the "rx" attribute for the shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.rx

ry()

Call Signature

ry(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:281

Defines the "rx" attribute for the shapes.

Returns

AccessorFn

Inherited from

Shape.ry

Call Signature

ry(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:282

Defines the "rx" attribute for the shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.ry

scale()

Call Signature

scale(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:286

The scale transform accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.scale

Call Signature

scale(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:287

The scale transform accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.scale

select()

Call Signature

select(): Selection

Defined in: core/types/src/shapes/Shape.d.ts:291

The SVG container element as a d3 selector or DOM element.

Returns

Selection

Inherited from

Shape.select

Call Signature

select(_: string | HTMLElement | SVGElement | null): this

Defined in: core/types/src/shapes/Shape.d.ts:292

The SVG container element as a d3 selector or DOM element.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | HTMLElement | SVGElement | null |

Returns

this

Inherited from

Shape.select

shapeConfig()

Call Signature

shapeConfig(): D3plusConfig

Defined in: core/types/src/utils/BaseClass.d.ts:74

Configuration object with key/value pairs applied as method calls on each shape.

Returns

D3plusConfig

Inherited from

Shape.shapeConfig

Call Signature

shapeConfig(_: D3plusConfig): this

Defined in: core/types/src/utils/BaseClass.d.ts:75

Configuration object with key/value pairs applied as method calls on each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | D3plusConfig |

Returns

this

Inherited from

Shape.shapeConfig

shapeRendering()

Call Signature

shapeRendering(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:301

The shape-rendering.

Returns

AccessorFn

Example

function(d) {
return d.x;
}

Inherited from

Shape.shapeRendering

Call Signature

shapeRendering(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:302

The shape-rendering.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Example

function(d) {
return d.x;
}

Inherited from

Shape.shapeRendering

sort()

Call Signature

sort(): ((a: DataPoint, b: DataPoint) => number) | null

Defined in: core/types/src/shapes/Shape.d.ts:306

A comparator function used to sort shapes for layering order.

Returns

((a: DataPoint, b: DataPoint) => number) | null

Inherited from

Shape.sort

Call Signature

sort(_: ((a: DataPoint, b: DataPoint) => number) | null): this

Defined in: core/types/src/shapes/Shape.d.ts:307

A comparator function used to sort shapes for layering order.

Parameters

| Parameter | Type | | ------ | ------ | | _ | ((a: DataPoint, b: DataPoint) => number) | null |

Returns

this

Inherited from

Shape.sort

stroke()

Call Signature

stroke(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:311

The stroke color accessor for each shape.

Returns

AccessorFn

Inherited from

Shape.stroke

Call Signature

stroke(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:312

The stroke color accessor for each shape.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.stroke

strokeDasharray()

Call Signature

strokeDasharray(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:316

Defines the "stroke-dasharray" attribute for the shapes.

Returns

AccessorFn

Inherited from

Shape.strokeDasharray

Call Signature

strokeDasharray(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:317

Defines the "stroke-dasharray" attribute for the shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.strokeDasharray

strokeLinecap()

Call Signature

strokeLinecap(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:321

Defines the "stroke-linecap" attribute for the shapes. Accepted values are "butt", "round", and "square".

Returns

AccessorFn

Inherited from

Shape.strokeLinecap

Call Signature

strokeLinecap(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:322

Defines the "stroke-linecap" attribute for the shapes. Accepted values are "butt", "round", and "square".

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.strokeLinecap

strokeOpacity()

Call Signature

strokeOpacity(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:326

Defines the "stroke-opacity" attribute for the shapes.

Returns

AccessorFn

Inherited from

Shape.strokeOpacity

Call Signature

strokeOpacity(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:327

Defines the "stroke-opacity" attribute for the shapes.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.strokeOpacity

strokeWidth()

Call Signature

strokeWidth(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:331

The stroke-width.

Returns

AccessorFn

Inherited from

Shape.strokeWidth

Call Signature

strokeWidth(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:332

The stroke-width.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Inherited from

Shape.strokeWidth

textAnchor()

Call Signature

textAnchor(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:336

The text-anchor.

Returns

AccessorFn

Inherited from

Shape.textAnchor

Call Signature

textAnchor(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:337

The text-anchor.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.textAnchor

texture()

Call Signature

texture(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:341

Defines the texture used inside of each shape. This uses the textures.js package, and expects either a simple string ("lines" or "circles") or a more complex Object containing the various properties of the texture (ie. {texture: "lines", orientation: "3/8", stroke: "darkorange"}). If multiple textures are necessary, provide an accsesor Function that returns the correct String/Object for each given data point and index.

Returns

AccessorFn

Inherited from

Shape.texture

Call Signature

texture(_: string | Record<string, unknown> | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:342

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | Record<string, unknown> | AccessorFn |

Returns

this

Inherited from

Shape.texture

textureDefault()

Call Signature

textureDefault(): Record<string, unknown>

Defined in: core/types/src/shapes/Shape.d.ts:346

A series of global texture methods to be used for all textures (ie. {stroke: "darkorange", strokeWidth: 2}).

Returns

Record<string, unknown>

Inherited from

Shape.textureDefault

Call Signature

textureDefault(_: Record<string, unknown>): this

Defined in: core/types/src/shapes/Shape.d.ts:347

A series of global texture methods to be used for all textures (ie. {stroke: "darkorange", strokeWidth: 2}).

Parameters

| Parameter | Type | | ------ | ------ | | _ | Record<string, unknown> |

Returns

this

Inherited from

Shape.textureDefault

translate()

Call Signature

translate(): (d: string, locale?: string) => string

Defined in: core/types/src/utils/BaseClass.d.ts:69

Defines how informational text strings should be displayed. By default, this function will try to find the string in question (which is the first argument provided to this function) inside of an internally managed translation Object. If you'd like to override to use custom text, simply pass this method your own custom formatting function.

Returns

(d: string, locale?: string) => string

Example

.translate(function(d) {
return d === "Back" ? "Get outta here" : d;
})

Inherited from

Shape.translate

Call Signature

translate(_: (d: string, locale?: string) => string): this

Defined in: core/types/src/utils/BaseClass.d.ts:70

Parameters

| Parameter | Type | | ------ | ------ | | _ | (d: string, locale?: string) => string |

Returns

this

Example

.translate(function(d) {
return d === "Back" ? "Get outta here" : d;
})

Inherited from

Shape.translate

vectorEffect()

Call Signature

vectorEffect(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:351

The vector-effect.

Returns

AccessorFn

Inherited from

Shape.vectorEffect

Call Signature

vectorEffect(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:352

The vector-effect.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.vectorEffect

verticalAlign()

Call Signature

verticalAlign(): AccessorFn

Defined in: core/types/src/shapes/Shape.d.ts:356

The vertical alignment.

Returns

AccessorFn

Inherited from

Shape.verticalAlign

Call Signature

verticalAlign(_: string | AccessorFn): this

Defined in: core/types/src/shapes/Shape.d.ts:357

The vertical alignment.

Parameters

| Parameter | Type | | ------ | ------ | | _ | string | AccessorFn |

Returns

this

Inherited from

Shape.verticalAlign

x()

Call Signature

x(): AccessorFn

Defined in: core/types/src/shapes/Area.d.ts:54

The x position accessor. Also sets x0 to the same value.

Returns

AccessorFn

Overrides

Shape.x

Call Signature

x(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Area.d.ts:55

The x position accessor. Also sets x0 to the same value.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Overrides

Shape.x

x0()

Call Signature

x0(): AccessorFn

Defined in: core/types/src/shapes/Area.d.ts:59

The x0 (left edge) position accessor for the area.

Returns

AccessorFn

Call Signature

x0(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Area.d.ts:60

The x0 (left edge) position accessor for the area.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

x1()

Call Signature

x1(): AccessorFn | null

Defined in: core/types/src/shapes/Area.d.ts:64

The x1 (right edge) position accessor for the area.

Returns

AccessorFn | null

Call Signature

x1(_: number | AccessorFn | null): this

Defined in: core/types/src/shapes/Area.d.ts:65

The x1 (right edge) position accessor for the area.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn | null |

Returns

this

y()

Call Signature

y(): AccessorFn

Defined in: core/types/src/shapes/Area.d.ts:69

The y position accessor. Also sets y0 to the same value.

Returns

AccessorFn

Overrides

Shape.y

Call Signature

y(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Area.d.ts:70

The y position accessor. Also sets y0 to the same value.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

Overrides

Shape.y

y0()

Call Signature

y0(): AccessorFn

Defined in: core/types/src/shapes/Area.d.ts:74

The y0 (top edge) position accessor for the area.

Returns

AccessorFn

Call Signature

y0(_: number | AccessorFn): this

Defined in: core/types/src/shapes/Area.d.ts:75

The y0 (top edge) position accessor for the area.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn |

Returns

this

y1()

Call Signature

y1(): AccessorFn | null

Defined in: core/types/src/shapes/Area.d.ts:79

The y1 (bottom edge) position accessor for the area.

Returns

AccessorFn | null

Call Signature

y1(_: number | AccessorFn | null): this

Defined in: core/types/src/shapes/Area.d.ts:80

The y1 (bottom edge) position accessor for the area.

Parameters

| Parameter | Type | | ------ | ------ | | _ | number | AccessorFn | null |

Returns

this

Properties

| Property | Type | Overrides | Inherited from | Defined in | | ------ | ------ | ------ | ------ | ------ | | _active | ((d: DataPoint, i: number) => boolean) | null | - | Shape._active | core/types/src/shapes/Shape.d.ts:71 | | _activeGroup | Selection | - | Shape._activeGroup | core/types/src/shapes/Shape.d.ts:69 | | _activeOpacity | number | - | Shape._activeOpacity | core/types/src/shapes/Shape.d.ts:20 | | _activeStyle | Record<string, unknown> | - | Shape._activeStyle | core/types/src/shapes/Shape.d.ts:21 | | _ariaLabel | AccessorFn | - | Shape._ariaLabel | core/types/src/shapes/Shape.d.ts:22 | | _backgroundImage | AccessorFn | - | Shape._backgroundImage | core/types/src/shapes/Shape.d.ts:23 | | _backgroundImageClass | Image | - | Shape._backgroundImageClass | core/types/src/shapes/Shape.d.ts:24 | | _configDefault? | D3plusConfig | - | Shape._configDefault | core/types/src/utils/BaseClass.d.ts:11 | | _curve | AccessorFn | Shape._curve | - | core/types/src/shapes/Area.d.ts:8 | | _data | DataPoint[] | - | Shape._data | core/types/src/shapes/Shape.d.ts:25 | | _defined | (d: DataPoint) => boolean | Shape._defined | - | core/types/src/shapes/Area.d.ts:9 | | _discrete | string | required | - | Shape._discrete | core/types/src/shapes/Shape.d.ts:73 | | _duration | number | - | Shape._duration | core/types/src/shapes/Shape.d.ts:26 | | _enter | Selection | - | Shape._enter | core/types/src/shapes/Shape.d.ts:66 | | _exit | Selection | - | Shape._exit | core/types/src/shapes/Shape.d.ts:67 | | _fill | AccessorFn | - | Shape._fill | core/types/src/shapes/Shape.d.ts:27 | | _fillOpacity | AccessorFn | - | Shape._fillOpacity | core/types/src/shapes/Shape.d.ts:28 | | _group | Selection | - | Shape._group | core/types/src/shapes/Shape.d.ts:64 | | _hitArea | ((d: DataPoint, i: number, aes: ShapeAes) => Record<string, unknown>) | null | - | Shape._hitArea | core/types/src/shapes/Shape.d.ts:70 | | _hover | ((d: DataPoint, i: number) => boolean) | null | - | Shape._hover | core/types/src/shapes/Shape.d.ts:72 | | _hoverGroup | Selection | - | Shape._hoverGroup | core/types/src/shapes/Shape.d.ts:68 | | _hoverOpacity | number | - | Shape._hoverOpacity | core/types/src/shapes/Shape.d.ts:29 | | _hoverStyle | Record<string, unknown> | - | Shape._hoverStyle | core/types/src/shapes/Shape.d.ts:30 | | _id | AccessorFn | - | Shape._id | core/types/src/shapes/Shape.d.ts:31 | | _label | AccessorFn | - | Shape._label | core/types/src/shapes/Shape.d.ts:32 | | _labelBounds | ((d: DataPoint, i: number, aes: ShapeAes) => false | Record<string, unknown> | null) | null | Shape._labelBounds | - | core/types/src/shapes/Area.d.ts:10 | | _labelClass | TextBox | - | Shape._labelClass | core/types/src/shapes/Shape.d.ts:33 | | _labelConfig | Record<string, unknown> | Shape._labelConfig | - | core/types/src/shapes/Area.d.ts:11 | | _locale | string | - | Shape._locale | core/types/src/utils/BaseClass.d.ts:6 | | _name | string | Shape._name | - | core/types/src/shapes/Area.d.ts:12 | | _on | Record<string, (...args: unknown[]) => unknown> | - | Shape._on | core/types/src/utils/BaseClass.d.ts:7 | | _opacity | AccessorFn | - | Shape._opacity | core/types/src/shapes/Shape.d.ts:37 | | _parent | Record<string, unknown> | - | Shape._parent | core/types/src/utils/BaseClass.d.ts:8 | | _path | Record<string, unknown> | Shape._path | - | core/types/src/shapes/Area.d.ts:19 | | _pointerEvents | AccessorFn | - | Shape._pointerEvents | core/types/src/shapes/Shape.d.ts:38 | | _role | AccessorFn | - | Shape._role | core/types/src/shapes/Shape.d.ts:39 | | _rotate | AccessorFn | - | Shape._rotate | core/types/src/shapes/Shape.d.ts:40 | | _rx | AccessorFn | - | Shape._rx | core/types/src/shapes/Shape.d.ts:41 | | _ry | AccessorFn | - | Shape._ry | core/types/src/shapes/Shape.d.ts:42 | | _scale | AccessorFn | - | Shape._scale | core/types/src/shapes/Shape.d.ts:43 | | _select | Selection | - | Shape._select | core/types/src/shapes/Shape.d.ts:59 | | _shapeConfig? | D3plusConfig | - | Shape._shapeConfig | core/types/src/utils/BaseClass.d.ts:12 | | _shapeRendering | AccessorFn | - | Shape._shapeRendering | core/types/src/shapes/Shape.d.ts:44 | | _sort | ((a: DataPoint, b: DataPoint) => number) | null | - | Shape._sort | core/types/src/shapes/Shape.d.ts:63 | | _stroke | AccessorFn | - | Shape._stroke | core/types/src/shapes/Shape.d.ts:45 | | _strokeDasharray | AccessorFn | - | Shape._strokeDasharray | core/types/src/shapes/Shape.d.ts:46 | | _strokeLinecap | AccessorFn | - | Shape._strokeLinecap | core/types/src/shapes/Shape.d.ts:47 | | _strokeOpacity | AccessorFn | - | Shape._strokeOpacity | core/types/src/shapes/Shape.d.ts:48 | | _strokeWidth | AccessorFn | - | Shape._strokeWidth | core/types/src/shapes/Shape.d.ts:49 | | _tagName | string | - | Shape._tagName | core/types/src/shapes/Shape.d.ts:50 | | _textAnchor | AccessorFn | - | Shape._textAnchor | core/types/src/shapes/Shape.d.ts:51 | | _texture | AccessorFn | - | Shape._texture | core/types/src/shapes/Shape.d.ts:52 | | <a id="property

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

@d3plus/types

Installing

Examples

API Reference

Classes

Area

Extends

Methods

active()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

activeOpacity()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

activeStyle()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

ariaLabel()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

backgroundImage()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

config()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

curve()

Call Signature

Returns

Call Signature

Parameters

Returns

data()

Call Signature

Returns

Inherited from

Call Signature

Parameters

Returns

Inherited from

defined()

Call Signature

Returns

Call Signature