@d3plus/core 3.0.16 → 3.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +88485 -2998
- package/es/index.js +1 -1
- package/es/src/charts/AreaPlot.js +1 -3
- package/es/src/charts/BarChart.js +1 -3
- package/es/src/charts/BoxWhisker.js +2 -4
- package/es/src/charts/BumpChart.js +4 -5
- package/es/src/charts/Donut.js +1 -3
- package/es/src/charts/Geomap.js +47 -88
- package/es/src/charts/LinePlot.js +1 -3
- package/es/src/charts/Matrix.js +27 -46
- package/es/src/charts/Network.js +87 -81
- package/es/src/charts/Pack.js +21 -34
- package/es/src/charts/Pie.js +12 -24
- package/es/src/charts/Plot.js +226 -321
- package/es/src/charts/Priestley.js +18 -36
- package/es/src/charts/Radar.js +100 -47
- package/es/src/charts/RadialMatrix.js +35 -47
- package/es/src/charts/Rings.js +99 -90
- package/es/src/charts/Sankey.js +85 -75
- package/es/src/charts/StackedArea.js +1 -3
- package/es/src/charts/Tree.js +27 -28
- package/es/src/charts/Treemap.js +117 -71
- package/es/src/charts/Viz.js +296 -492
- package/es/src/charts/drawSteps/drawAttribution.js +1 -1
- package/es/src/charts/drawSteps/drawBack.js +1 -2
- package/es/src/charts/drawSteps/drawColorScale.js +1 -2
- package/es/src/charts/drawSteps/drawLegend.js +8 -10
- package/es/src/charts/drawSteps/drawSubtitle.js +1 -3
- package/es/src/charts/drawSteps/drawTimeline.js +12 -9
- package/es/src/charts/drawSteps/drawTitle.js +1 -3
- package/es/src/charts/drawSteps/drawTotal.js +1 -3
- package/es/src/charts/drawSteps/zoomControls.js +19 -21
- package/es/src/charts/events/click.legend.js +2 -3
- package/es/src/charts/events/click.shape.js +2 -4
- package/es/src/charts/events/mouseenter.js +7 -8
- package/es/src/charts/events/mouseleave.js +1 -3
- package/es/src/charts/events/mousemove.legend.js +3 -4
- package/es/src/charts/events/mousemove.shape.js +2 -4
- package/es/src/charts/events/touchstart.body.js +1 -1
- package/es/src/charts/helpers/matrixData.js +11 -4
- package/es/src/charts/helpers/tileAttributions.js +2 -1
- package/es/src/charts/plotBuffers/Bar.js +55 -12
- package/es/src/charts/plotBuffers/Box.js +55 -12
- package/es/src/charts/plotBuffers/Circle.js +9 -11
- package/es/src/charts/plotBuffers/Line.js +4 -6
- package/es/src/charts/plotBuffers/Rect.js +10 -12
- package/es/src/charts/plotBuffers/discreteBuffer.js +4 -2
- package/es/src/charts/plotBuffers/numericBuffer.js +7 -6
- package/es/src/components/Axis.js +298 -426
- package/es/src/components/AxisBottom.js +1 -3
- package/es/src/components/AxisLeft.js +1 -3
- package/es/src/components/AxisRight.js +1 -3
- package/es/src/components/AxisTop.js +1 -3
- package/es/src/components/ColorScale.js +80 -197
- package/es/src/components/Legend.js +82 -135
- package/es/src/components/Message.js +27 -19
- package/es/src/components/TextBox.js +106 -262
- package/es/src/components/Timeline.js +88 -155
- package/es/src/components/Tooltip.js +301 -330
- package/es/src/shapes/Area.js +95 -74
- package/es/src/shapes/Bar.js +46 -86
- package/es/src/shapes/Box.js +104 -118
- package/es/src/shapes/Circle.js +29 -30
- package/es/src/shapes/Image.js +44 -102
- package/es/src/shapes/Line.js +74 -40
- package/es/src/shapes/Path.js +23 -25
- package/es/src/shapes/Rect.js +29 -41
- package/es/src/shapes/Shape.js +146 -363
- package/es/src/shapes/Whisker.js +89 -90
- package/es/src/utils/AccessorFn.js +4 -0
- package/es/src/utils/BaseClass.js +53 -82
- package/es/src/utils/D3plusConfig.js +1 -0
- package/es/src/utils/RESET.js +2 -4
- package/es/src/utils/accessor.js +4 -5
- package/es/src/utils/configPrep.js +13 -12
- package/es/src/utils/constant.js +2 -3
- package/es/src/utils/getProp.js +4 -4
- package/es/src/utils/index.js +0 -1
- package/package.json +30 -22
- package/types/index.d.ts +5 -0
- package/types/src/charts/AreaPlot.d.ts +16 -0
- package/types/src/charts/BarChart.d.ts +16 -0
- package/types/src/charts/BoxWhisker.d.ts +11 -0
- package/types/src/charts/BumpChart.d.ts +36 -0
- package/types/src/charts/Donut.d.ts +11 -0
- package/types/src/charts/Geomap.d.ts +120 -0
- package/types/src/charts/LinePlot.d.ts +15 -0
- package/types/src/charts/Matrix.d.ts +74 -0
- package/types/src/charts/Network.d.ts +78 -0
- package/types/src/charts/Pack.d.ts +47 -0
- package/types/src/charts/Pie.d.ts +44 -0
- package/types/src/charts/Plot.d.ts +199 -0
- package/types/src/charts/Priestley.d.ts +37 -0
- package/types/src/charts/Radar.d.ts +38 -0
- package/types/src/charts/RadialMatrix.d.ts +78 -0
- package/types/src/charts/Rings.d.ts +74 -0
- package/types/src/charts/Sankey.d.ts +81 -0
- package/types/src/charts/StackedArea.d.ts +14 -0
- package/types/src/charts/Tree.d.ts +33 -0
- package/types/src/charts/Treemap.d.ts +51 -0
- package/types/src/charts/Viz.d.ts +402 -0
- package/types/src/charts/drawSteps/drawAttribution.d.ts +7 -0
- package/types/src/charts/drawSteps/drawBack.d.ts +6 -0
- package/types/src/charts/drawSteps/drawColorScale.d.ts +6 -0
- package/types/src/charts/drawSteps/drawLegend.d.ts +12 -0
- package/types/src/charts/drawSteps/drawSubtitle.d.ts +7 -0
- package/types/src/charts/drawSteps/drawTimeline.d.ts +7 -0
- package/types/src/charts/drawSteps/drawTitle.d.ts +7 -0
- package/types/src/charts/drawSteps/drawTotal.d.ts +7 -0
- package/types/src/charts/drawSteps/zoomControls.d.ts +7 -0
- package/types/src/charts/events/click.legend.d.ts +8 -0
- package/types/src/charts/events/click.shape.d.ts +8 -0
- package/types/src/charts/events/mouseenter.d.ts +8 -0
- package/types/src/charts/events/mouseleave.d.ts +8 -0
- package/types/src/charts/events/mousemove.legend.d.ts +9 -0
- package/types/src/charts/events/mousemove.shape.d.ts +9 -0
- package/types/src/charts/events/touchstart.body.d.ts +7 -0
- package/types/src/charts/helpers/matrixData.d.ts +11 -0
- package/types/src/charts/helpers/tileAttributions.d.ts +6 -0
- package/types/src/charts/index.d.ts +21 -0
- package/types/src/charts/plotBuffers/Bar.d.ts +16 -0
- package/types/src/charts/plotBuffers/Box.d.ts +16 -0
- package/types/src/charts/plotBuffers/Circle.d.ts +20 -0
- package/types/src/charts/plotBuffers/Line.d.ts +16 -0
- package/types/src/charts/plotBuffers/Rect.d.ts +19 -0
- package/types/src/charts/plotBuffers/discreteBuffer.d.ts +7 -0
- package/types/src/charts/plotBuffers/numericBuffer.d.ts +5 -0
- package/types/src/components/Axis.d.ts +309 -0
- package/types/src/components/AxisBottom.d.ts +11 -0
- package/types/src/components/AxisLeft.d.ts +11 -0
- package/types/src/components/AxisRight.d.ts +11 -0
- package/types/src/components/AxisTop.d.ts +11 -0
- package/types/src/components/ColorScale.d.ts +208 -0
- package/types/src/components/Legend.d.ts +157 -0
- package/types/src/components/Message.d.ts +40 -0
- package/types/src/components/TextBox.d.ts +278 -0
- package/types/src/components/Timeline.d.ts +157 -0
- package/types/src/components/Tooltip.d.ts +297 -0
- package/types/src/components/index.d.ts +11 -0
- package/types/src/shapes/Area.d.ts +81 -0
- package/types/src/shapes/Bar.d.ts +104 -0
- package/types/src/shapes/Box.d.ts +121 -0
- package/types/src/shapes/Circle.d.ts +44 -0
- package/types/src/shapes/Image.d.ts +124 -0
- package/types/src/shapes/Line.d.ts +48 -0
- package/types/src/shapes/Path.d.ts +38 -0
- package/types/src/shapes/Rect.d.ts +54 -0
- package/types/src/shapes/Shape.d.ts +378 -0
- package/types/src/shapes/Whisker.d.ts +96 -0
- package/types/src/shapes/index.d.ts +10 -0
- package/types/src/utils/AccessorFn.d.ts +6 -0
- package/types/src/utils/BaseClass.d.ts +76 -0
- package/types/src/utils/D3plusConfig.d.ts +164 -0
- package/types/src/utils/RESET.d.ts +3 -0
- package/types/src/utils/accessor.d.ts +13 -0
- package/types/src/utils/configPrep.d.ts +28 -0
- package/types/src/utils/constant.d.ts +11 -0
- package/types/src/utils/getProp.d.ts +9 -0
- package/types/src/utils/index.d.ts +8 -0
- package/umd/d3plus-core.full.js +20127 -18701
- package/umd/d3plus-core.full.js.map +1 -1
- package/umd/d3plus-core.full.min.js +2920 -5394
- package/umd/d3plus-core.js +1920 -4074
- package/umd/d3plus-core.js.map +1 -1
- package/umd/d3plus-core.min.js +1605 -3937
- package/es/src/utils/uuid.js +0 -13
|
@@ -0,0 +1,402 @@
|
|
|
1
|
+
import { select } from "d3-selection";
|
|
2
|
+
import type { DataPoint } from "@d3plus/data";
|
|
3
|
+
declare const Viz_base: any;
|
|
4
|
+
/**
|
|
5
|
+
Creates an x/y plot based on an array of data. See [this example](https://d3plus.org/examples/d3plus-treemap/getting-started/) for help getting started using the treemap generator.
|
|
6
|
+
*/
|
|
7
|
+
export default class Viz extends Viz_base {
|
|
8
|
+
[key: string]: any;
|
|
9
|
+
/**
|
|
10
|
+
Invoked when creating a new class instance, and sets any default parameters.
|
|
11
|
+
@private
|
|
12
|
+
*/
|
|
13
|
+
constructor();
|
|
14
|
+
/**
|
|
15
|
+
Called by draw before anything is drawn. Formats the data and performs preparations for draw.
|
|
16
|
+
@private
|
|
17
|
+
*/
|
|
18
|
+
_preDraw(): void;
|
|
19
|
+
/**
|
|
20
|
+
Called by render once all checks are passed.
|
|
21
|
+
@private
|
|
22
|
+
*/
|
|
23
|
+
_draw(): void;
|
|
24
|
+
/**
|
|
25
|
+
* Applies the threshold algorithm according to the type of chart used.
|
|
26
|
+
* @param {Array} data The data to process.
|
|
27
|
+
* @private
|
|
28
|
+
*/
|
|
29
|
+
_thresholdFunction(data: DataPoint[], _tree?: unknown): DataPoint[];
|
|
30
|
+
/**
|
|
31
|
+
* Detects width and height and sets SVG properties
|
|
32
|
+
* @private
|
|
33
|
+
*/
|
|
34
|
+
_setSVGSize(width?: number, height?: number): void;
|
|
35
|
+
/**
|
|
36
|
+
Draws the visualization given the specified configuration.
|
|
37
|
+
@param callback Optional callback invoked after rendering completes.
|
|
38
|
+
*/
|
|
39
|
+
render(callback?: () => void): this;
|
|
40
|
+
/**
|
|
41
|
+
Tears down the visualization: disconnects the ResizeObserver and removes DOM event listeners. Call this when unmounting to avoid memory leaks.
|
|
42
|
+
*/
|
|
43
|
+
destroy(): this;
|
|
44
|
+
/**
|
|
45
|
+
The active callback function for highlighting shapes.
|
|
46
|
+
*/
|
|
47
|
+
active(_?: ((d: DataPoint, i: number) => boolean) | false): this | ((d: DataPoint, i: number) => boolean) | false;
|
|
48
|
+
/**
|
|
49
|
+
Custom aggregation methods for each data key.
|
|
50
|
+
*/
|
|
51
|
+
aggs(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
52
|
+
/**
|
|
53
|
+
The "aria-hidden" attribute of the containing SVG element. The default value is "false", but if you need to hide the SVG from screen readers set this property to "true".
|
|
54
|
+
*/
|
|
55
|
+
ariaHidden(_?: boolean): this | boolean;
|
|
56
|
+
/**
|
|
57
|
+
Sets text to be shown positioned absolute on top of the visualization in the bottom-right corner. This is most often used in Geomaps to display the copyright of map tiles. The text is rendered as HTML, so any valid HTML string will render as expected (eg. anchor links work).
|
|
58
|
+
*/
|
|
59
|
+
attribution(_?: string | boolean): this | string | boolean;
|
|
60
|
+
/**
|
|
61
|
+
Configuration object for the attribution style.
|
|
62
|
+
*/
|
|
63
|
+
attributionStyle(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
64
|
+
/**
|
|
65
|
+
Configuration object for the back button.
|
|
66
|
+
*/
|
|
67
|
+
backConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
68
|
+
/**
|
|
69
|
+
Enables a lru cache that stores up to 5 previously loaded files/URLs. Helpful when constantly writing over the data array with a URL in the render function of a react component.
|
|
70
|
+
*/
|
|
71
|
+
cache(_?: boolean): this | boolean;
|
|
72
|
+
/**
|
|
73
|
+
Defines the main color to be used for each data point in a visualization. Can be either an accessor function or a string key to reference in each data point. If a color value is returned, it will be used as is. If a string is returned, a unique color will be assigned based on the string.
|
|
74
|
+
*/
|
|
75
|
+
color(_?: string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false): this | string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false;
|
|
76
|
+
/**
|
|
77
|
+
Defines the value to be used for a color scale. Can be either an accessor function or a string key to reference in each data point.
|
|
78
|
+
*/
|
|
79
|
+
colorScale(_?: string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false): this | string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false;
|
|
80
|
+
/**
|
|
81
|
+
A pass-through to the config method of ColorScale.
|
|
82
|
+
*/
|
|
83
|
+
colorScaleConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
84
|
+
/**
|
|
85
|
+
Tells the colorScale whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the colorScale appears centered above the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
86
|
+
*/
|
|
87
|
+
colorScalePadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
88
|
+
/**
|
|
89
|
+
Defines which side of the visualization to anchor the color scale. Acceptable values are `"top"`, `"bottom"`, `"left"`, `"right"`, and `false`. A `false` value will cause the color scale to not be displayed, but will still color shapes based on the scale.
|
|
90
|
+
*/
|
|
91
|
+
colorScalePosition(_?: string | boolean | (() => string | boolean)): this | string | boolean | (() => string | boolean);
|
|
92
|
+
/**
|
|
93
|
+
The maximum pixel size for drawing the color scale: width for horizontal scales and height for vertical scales.
|
|
94
|
+
*/
|
|
95
|
+
colorScaleMaxSize(_?: number): this | number;
|
|
96
|
+
/**
|
|
97
|
+
The primary data array used to draw the visualization. The value passed should be an *Array* of objects or a *String* representing a filepath or URL to be loaded. The following filetypes are supported: `csv`, `tsv`, `txt`, and `json`.
|
|
98
|
+
|
|
99
|
+
If your data URL needs specific headers to be set, an Object with "url" and "headers" keys may also be passed.
|
|
100
|
+
|
|
101
|
+
Additionally, a custom formatting function can be passed as a second argument to this method. This custom function will be passed the data that has been loaded, as long as there are no errors. This function should return the final array of obejcts to be used as the primary data array. For example, some JSON APIs return the headers split from the data values to save bandwidth. These would need be joined using a custom formatter.
|
|
102
|
+
|
|
103
|
+
If you would like to specify certain configuration options based on the yet-to-be-loaded data, you can also return a full `config` object from the data formatter (including the new `data` array as a key in the object).
|
|
104
|
+
|
|
105
|
+
Defaults to an empty array (`[]`).
|
|
106
|
+
@param f The data array or a URL string to load data from.
|
|
107
|
+
*/
|
|
108
|
+
data(_?: DataPoint[] | string | {
|
|
109
|
+
url: string;
|
|
110
|
+
headers: Record<string, string>;
|
|
111
|
+
}, f?: (data: DataPoint[]) => DataPoint[] | Record<string, unknown>): this | DataPoint[];
|
|
112
|
+
/**
|
|
113
|
+
If the number of visible data points exceeds this number, the default hover behavior will be disabled (helpful for very large visualizations bogging down the DOM with opacity updates).
|
|
114
|
+
*/
|
|
115
|
+
dataCutoff(_?: number): this | number;
|
|
116
|
+
/**
|
|
117
|
+
The current depth of the visualization. The value should correspond with an index in the [groupBy](#groupBy) array.
|
|
118
|
+
*/
|
|
119
|
+
depth(_?: number): this | number;
|
|
120
|
+
/**
|
|
121
|
+
If the width and/or height of a Viz is not user-defined, it is determined by the size of it's parent element. When this method is set to `true`, the Viz will listen for the `window.onresize` event and adjust it's dimensions accordingly.
|
|
122
|
+
*/
|
|
123
|
+
detectResize(_?: boolean): this | boolean;
|
|
124
|
+
/**
|
|
125
|
+
When resizing the browser window, this is the millisecond delay to trigger the resize event.
|
|
126
|
+
*/
|
|
127
|
+
detectResizeDelay(_?: number): this | number;
|
|
128
|
+
/**
|
|
129
|
+
Toggles whether or not the Viz should try to detect if it visible in the current viewport. When this method is set to `true`, the Viz will only be rendered when it has entered the viewport either through scrolling or if it's display or visibility is changed.
|
|
130
|
+
*/
|
|
131
|
+
detectVisible(_?: boolean): this | boolean;
|
|
132
|
+
/**
|
|
133
|
+
The interval, in milliseconds, for checking if the visualization is visible on the page.
|
|
134
|
+
*/
|
|
135
|
+
detectVisibleInterval(_?: number): this | number;
|
|
136
|
+
/**
|
|
137
|
+
If *value* is specified, sets the discrete accessor to the specified method name (usually an axis) and returns the current class instance.
|
|
138
|
+
*/
|
|
139
|
+
discrete(_?: string): this | string;
|
|
140
|
+
/**
|
|
141
|
+
Shows a button that allows for downloading the current visualization.
|
|
142
|
+
*/
|
|
143
|
+
downloadButton(_?: boolean): this | boolean;
|
|
144
|
+
/**
|
|
145
|
+
Sets specific options of the saveElement function used when downloading the visualization.
|
|
146
|
+
*/
|
|
147
|
+
downloadConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
148
|
+
/**
|
|
149
|
+
Defines which control group to add the download button into.
|
|
150
|
+
*/
|
|
151
|
+
downloadPosition(_?: string): this | string;
|
|
152
|
+
/**
|
|
153
|
+
The animation duration in milliseconds.
|
|
154
|
+
*/
|
|
155
|
+
duration(_?: number): this | number;
|
|
156
|
+
/**
|
|
157
|
+
A filter function applied to the data before drawing.
|
|
158
|
+
*/
|
|
159
|
+
filter(_?: ((d: DataPoint, i: number) => boolean) | false): this | ((d: DataPoint, i: number) => boolean) | false;
|
|
160
|
+
/**
|
|
161
|
+
The font family used throughout the visualization.
|
|
162
|
+
*/
|
|
163
|
+
fontFamily(_?: string | string[]): this | string | string[];
|
|
164
|
+
/**
|
|
165
|
+
Defines the mapping between data and shape. The value can be a String matching a key in each data point (default is "id"), or an accessor Function that returns a unique value for each data point. Additionally, an Array of these values may be provided if the visualization supports nested hierarchies.
|
|
166
|
+
*/
|
|
167
|
+
groupBy(_?: string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | (string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]))[]): this | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint])[];
|
|
168
|
+
/**
|
|
169
|
+
The overall height of the visualization in pixels.
|
|
170
|
+
*/
|
|
171
|
+
height(_?: number): this | number;
|
|
172
|
+
/**
|
|
173
|
+
Defines the color used for legend shapes when the corresponding grouping is hidden from display (by clicking on the legend).
|
|
174
|
+
*/
|
|
175
|
+
hiddenColor(_?: string | ((d: DataPoint, i: number) => string)): this | string | ((d: DataPoint, i: number) => string);
|
|
176
|
+
/**
|
|
177
|
+
Defines the opacity used for legend labels when the corresponding grouping is hidden from display (by clicking on the legend).
|
|
178
|
+
*/
|
|
179
|
+
hiddenOpacity(_?: number | ((d: DataPoint, i: number) => number)): this | number | ((d: DataPoint, i: number) => number);
|
|
180
|
+
/**
|
|
181
|
+
The hover callback function for highlighting shapes on mouseover.
|
|
182
|
+
*/
|
|
183
|
+
hover(_?: ((d: DataPoint, i: number) => boolean) | false): this;
|
|
184
|
+
/**
|
|
185
|
+
Accessor function or string key for the label of each data point.
|
|
186
|
+
*/
|
|
187
|
+
label(_?: string | ((d: DataPoint, i: number) => string)): this | string | ((d: DataPoint, i: number) => string);
|
|
188
|
+
/**
|
|
189
|
+
Whether to display the legend.
|
|
190
|
+
*/
|
|
191
|
+
legend(_?: boolean | ((config: Record<string, unknown>, arr: DataPoint[]) => boolean)): this | boolean | ((config: Record<string, unknown>, arr: DataPoint[]) => boolean);
|
|
192
|
+
/**
|
|
193
|
+
Configuration object passed to the legend's config method.
|
|
194
|
+
*/
|
|
195
|
+
legendConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
196
|
+
/**
|
|
197
|
+
Defines the click functionality of categorical legend squares. When set to false, clicking will hide that category and shift+clicking will solo that category. When set to true, clicking with solo that category and shift+clicking will hide that category.
|
|
198
|
+
*/
|
|
199
|
+
legendFilterInvert(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
200
|
+
/**
|
|
201
|
+
Tells the legend whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the legend appears centered underneath the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
202
|
+
*/
|
|
203
|
+
legendPadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
204
|
+
/**
|
|
205
|
+
Defines which side of the visualization to anchor the legend. Expected values are `"top"`, `"bottom"`, `"left"`, and `"right"`.
|
|
206
|
+
*/
|
|
207
|
+
legendPosition(_?: string | (() => string)): this | string | (() => string);
|
|
208
|
+
/**
|
|
209
|
+
A JavaScript [sort comparator function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) used to sort the legend.
|
|
210
|
+
*/
|
|
211
|
+
legendSort(_?: (a: DataPoint, b: DataPoint) => number): this | ((a: DataPoint, b: DataPoint) => number);
|
|
212
|
+
/**
|
|
213
|
+
Configuration object for the legend tooltip.
|
|
214
|
+
*/
|
|
215
|
+
legendTooltip(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
216
|
+
/**
|
|
217
|
+
The inner HTML of the status message displayed when loading AJAX requests and displaying errors. Must be a valid HTML string or a function that, when passed this Viz instance, returns a valid HTML string.
|
|
218
|
+
*/
|
|
219
|
+
loadingHTML(_?: string | ((viz: Viz) => string)): this | string | ((viz: Viz) => string);
|
|
220
|
+
/**
|
|
221
|
+
Toggles the visibility of the status message that is displayed when loading AJAX requests and displaying errors.
|
|
222
|
+
*/
|
|
223
|
+
loadingMessage(_?: boolean): this | boolean;
|
|
224
|
+
/**
|
|
225
|
+
The color of the mask displayed underneath the status message when loading AJAX requests and displaying errors. Set to `false` to turn off the mask completely.
|
|
226
|
+
*/
|
|
227
|
+
messageMask(_?: string | boolean): this | string | boolean;
|
|
228
|
+
/**
|
|
229
|
+
Defines the CSS style properties for the status message that is displayed when loading AJAX requests and displaying errors.
|
|
230
|
+
*/
|
|
231
|
+
messageStyle(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
232
|
+
/**
|
|
233
|
+
The inner HTML of the status message displayed when no data is supplied to the visualization. Must be a valid HTML string or a function that, when passed this Viz instance, returns a valid HTML string.
|
|
234
|
+
*/
|
|
235
|
+
noDataHTML(_?: string | ((viz: Viz) => string)): this | string | ((viz: Viz) => string);
|
|
236
|
+
/**
|
|
237
|
+
Toggles the visibility of the status message that is displayed when no data is supplied to the visualization.
|
|
238
|
+
*/
|
|
239
|
+
noDataMessage(_?: boolean): this | boolean;
|
|
240
|
+
/**
|
|
241
|
+
If using scroll or visibility detection, this method allow a custom override of the element to which the scroll detection function gets attached.
|
|
242
|
+
*/
|
|
243
|
+
scrollContainer(_?: string | HTMLElement | Window): this | string | HTMLElement | Window;
|
|
244
|
+
/**
|
|
245
|
+
The SVG container element as a d3 selector or DOM element. Defaults to `undefined`.
|
|
246
|
+
*/
|
|
247
|
+
select(_?: string | HTMLElement): this | ReturnType<typeof select>;
|
|
248
|
+
/**
|
|
249
|
+
Changes the primary shape used to represent each data point in a visualization. Not all visualizations support changing shapes, this method can be provided the String name of a D3plus shape class (for example, "Rect" or "Circle"), or an accessor Function that returns the String class name to be used for each individual data point.
|
|
250
|
+
*/
|
|
251
|
+
shape(_?: string | ((d: DataPoint, i: number) => string)): this | string | ((d: DataPoint, i: number) => string);
|
|
252
|
+
/**
|
|
253
|
+
Configuration object with key/value pairs applied as method calls on each shape.
|
|
254
|
+
*/
|
|
255
|
+
shapeConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
256
|
+
/**
|
|
257
|
+
Accessor function or string for the visualization's subtitle.
|
|
258
|
+
*/
|
|
259
|
+
subtitle(_?: string | ((data: DataPoint[]) => string)): this | string | ((data: DataPoint[]) => string);
|
|
260
|
+
/**
|
|
261
|
+
Configuration object for the subtitle.
|
|
262
|
+
*/
|
|
263
|
+
subtitleConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
264
|
+
/**
|
|
265
|
+
Tells the subtitle whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the subtitle appears centered above the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
266
|
+
*/
|
|
267
|
+
subtitlePadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
268
|
+
/**
|
|
269
|
+
The description text for the SVG `<desc>` element, used for accessibility.
|
|
270
|
+
*/
|
|
271
|
+
svgDesc(_?: string): this | string;
|
|
272
|
+
/**
|
|
273
|
+
The title text for the SVG `<title>` element, used for accessibility.
|
|
274
|
+
*/
|
|
275
|
+
svgTitle(_?: string): this | string;
|
|
276
|
+
/**
|
|
277
|
+
The threshold value for bucketing small data points together.
|
|
278
|
+
*/
|
|
279
|
+
threshold(_?: number | ((data: DataPoint[]) => number)): this | number | ((data: DataPoint[]) => number);
|
|
280
|
+
/**
|
|
281
|
+
Accessor for the value used in the threshold algorithm.
|
|
282
|
+
@param key The data key used to group values for thresholding.
|
|
283
|
+
*/
|
|
284
|
+
thresholdKey(key?: string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint])): this | string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]);
|
|
285
|
+
/**
|
|
286
|
+
The label displayed for bucketed threshold items.
|
|
287
|
+
*/
|
|
288
|
+
thresholdName(_?: string | ((d: DataPoint, i: number) => string)): this | string | ((d: DataPoint, i: number) => string);
|
|
289
|
+
/**
|
|
290
|
+
Accessor function or string key for the time dimension of each data point.
|
|
291
|
+
*/
|
|
292
|
+
time(_?: string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false): this | string | ((d: DataPoint, i: number) => DataPoint[keyof DataPoint]) | false;
|
|
293
|
+
/**
|
|
294
|
+
A filter function that limits which time periods are shown.
|
|
295
|
+
*/
|
|
296
|
+
timeFilter(_?: ((d: DataPoint, i: number) => boolean) | false): this | ((d: DataPoint, i: number) => boolean) | false;
|
|
297
|
+
/**
|
|
298
|
+
Whether to display the timeline.
|
|
299
|
+
*/
|
|
300
|
+
timeline(_?: boolean): this | boolean;
|
|
301
|
+
/**
|
|
302
|
+
Configuration object for the timeline.
|
|
303
|
+
*/
|
|
304
|
+
timelineConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
305
|
+
/**
|
|
306
|
+
The starting time or range for the timeline. Can be a single Date/String, or an Array of 2 values representing the min and max.
|
|
307
|
+
*/
|
|
308
|
+
timelineDefault(_?: Date | string | (Date | string)[]): this | Date[];
|
|
309
|
+
/**
|
|
310
|
+
Tells the timeline whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the timeline appears centered underneath the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
311
|
+
*/
|
|
312
|
+
timelinePadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
313
|
+
/**
|
|
314
|
+
Accessor function or string for the visualization's title.
|
|
315
|
+
*/
|
|
316
|
+
title(_?: string | ((data: DataPoint[]) => string)): this | string | ((data: DataPoint[]) => string);
|
|
317
|
+
/**
|
|
318
|
+
Configuration object for the title.
|
|
319
|
+
*/
|
|
320
|
+
titleConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
321
|
+
/**
|
|
322
|
+
Tells the title whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the title appears centered above the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
323
|
+
*/
|
|
324
|
+
titlePadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
325
|
+
/**
|
|
326
|
+
Whether to display tooltips on hover.
|
|
327
|
+
*/
|
|
328
|
+
tooltip(_?: boolean | ((d: DataPoint, i: number) => boolean)): this | boolean | ((d: DataPoint, i: number) => boolean);
|
|
329
|
+
/**
|
|
330
|
+
Configuration object for the tooltip.
|
|
331
|
+
*/
|
|
332
|
+
tooltipConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
333
|
+
/**
|
|
334
|
+
Accessor function or string key for the total value displayed in the visualization.
|
|
335
|
+
*/
|
|
336
|
+
total(_?: boolean | string | ((d: DataPoint, i: number) => number)): this | boolean | string | ((d: DataPoint, i: number) => number);
|
|
337
|
+
/**
|
|
338
|
+
Configuration object for the total bar.
|
|
339
|
+
*/
|
|
340
|
+
totalConfig(_?: Record<string, unknown>): this | Record<string, unknown>;
|
|
341
|
+
/**
|
|
342
|
+
Formatter function for the value in the total bar.
|
|
343
|
+
*/
|
|
344
|
+
totalFormat(_?: (d: number) => string): this | ((d: number) => string);
|
|
345
|
+
/**
|
|
346
|
+
Tells the total whether or not to use the internal padding defined by the visualization in it's positioning. For example, d3plus-plot will add padding on the left so that the total appears centered above the x-axis. By default, this padding is only applied on screens larger than 600 pixels wide.
|
|
347
|
+
*/
|
|
348
|
+
totalPadding(_?: boolean | (() => boolean)): this | boolean | (() => boolean);
|
|
349
|
+
/**
|
|
350
|
+
The overall width of the visualization in pixels.
|
|
351
|
+
*/
|
|
352
|
+
width(_?: number): this | number;
|
|
353
|
+
/**
|
|
354
|
+
Toggles the ability to zoom/pan the visualization. Certain parameters for zooming are required to be hooked up on a visualization by visualization basis.
|
|
355
|
+
*/
|
|
356
|
+
zoom(_?: boolean): this | boolean;
|
|
357
|
+
/**
|
|
358
|
+
The pixel stroke-width of the zoom brush area.
|
|
359
|
+
*/
|
|
360
|
+
zoomBrushHandleSize(_?: number): this | number;
|
|
361
|
+
/**
|
|
362
|
+
An object containing CSS key/value pairs that is used to style the outer handle area of the zoom brush. Passing `false` will remove all default styling.
|
|
363
|
+
*/
|
|
364
|
+
zoomBrushHandleStyle(_?: Record<string, unknown> | false): this | Record<string, unknown> | false;
|
|
365
|
+
/**
|
|
366
|
+
An object containing CSS key/value pairs that is used to style the inner selection area of the zoom brush. Passing `false` will remove all default styling.
|
|
367
|
+
*/
|
|
368
|
+
zoomBrushSelectionStyle(_?: Record<string, unknown> | false): this | Record<string, unknown> | false;
|
|
369
|
+
/**
|
|
370
|
+
An object containing CSS key/value pairs that is used to style each zoom control button (`.zoom-in`, `.zoom-out`, `.zoom-reset`, and `.zoom-brush`). Passing `false` will remove all default styling.
|
|
371
|
+
*/
|
|
372
|
+
zoomControlStyle(_?: Record<string, unknown> | false): this | Record<string, unknown> | false;
|
|
373
|
+
/**
|
|
374
|
+
An object containing CSS key/value pairs that is used to style each zoom control button when active (`.zoom-in`, `.zoom-out`, `.zoom-reset`, and `.zoom-brush`). Passing `false` will remove all default styling.
|
|
375
|
+
*/
|
|
376
|
+
zoomControlStyleActive(_?: Record<string, unknown> | false): this | Record<string, unknown> | false;
|
|
377
|
+
/**
|
|
378
|
+
An object containing CSS key/value pairs that is used to style each zoom control button on hover (`.zoom-in`, `.zoom-out`, `.zoom-reset`, and `.zoom-brush`). Passing `false` will remove all default styling.
|
|
379
|
+
*/
|
|
380
|
+
zoomControlStyleHover(_?: Record<string, unknown> | false): this | Record<string, unknown> | false;
|
|
381
|
+
/**
|
|
382
|
+
The multiplier that is used in with the control buttons when zooming in and out.
|
|
383
|
+
*/
|
|
384
|
+
zoomFactor(_?: number): this | number;
|
|
385
|
+
/**
|
|
386
|
+
The max zoom scale.
|
|
387
|
+
*/
|
|
388
|
+
zoomMax(_?: number): this | number;
|
|
389
|
+
/**
|
|
390
|
+
Toggles panning.
|
|
391
|
+
*/
|
|
392
|
+
zoomPan(_?: boolean): this | boolean;
|
|
393
|
+
/**
|
|
394
|
+
A pixel value to be used to pad all sides of a zoomed area.
|
|
395
|
+
*/
|
|
396
|
+
zoomPadding(_?: number): this | number;
|
|
397
|
+
/**
|
|
398
|
+
Toggles scroll zooming.
|
|
399
|
+
*/
|
|
400
|
+
zoomScroll(_?: boolean): this | boolean;
|
|
401
|
+
}
|
|
402
|
+
export {};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
Default label function for the legend.
|
|
5
|
+
@private
|
|
6
|
+
*/
|
|
7
|
+
export declare function legendLabel(this: Viz, d: DataPoint, i: number): string;
|
|
8
|
+
/**
|
|
9
|
+
Renders the legend if this._legend is not falsy.
|
|
10
|
+
@private
|
|
11
|
+
*/
|
|
12
|
+
export default function (this: Viz, data?: DataPoint[]): void;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
Renders the timeline if this._time and this._timeline are not falsy and there are more than 1 tick available.
|
|
5
|
+
@private
|
|
6
|
+
*/
|
|
7
|
+
export default function (this: Viz, data?: DataPoint[]): void;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
@module clickLegend
|
|
5
|
+
On click event for all legend shapes in a Viz.
|
|
6
|
+
@private
|
|
7
|
+
*/
|
|
8
|
+
export default function (this: Viz, d: DataPoint, i: number, x: DataPoint, event: MouseEvent): void;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
@module clickShape
|
|
5
|
+
On click event for all shapes in a Viz.
|
|
6
|
+
@private
|
|
7
|
+
*/
|
|
8
|
+
export default function (this: Viz, d: DataPoint, i: number, x: DataPoint, event: MouseEvent): void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
@module mouseMoveLegend
|
|
5
|
+
Tooltip logic for a specified data point.
|
|
6
|
+
@param config Optional configuration methods for the Tooltip class.
|
|
7
|
+
@private
|
|
8
|
+
*/
|
|
9
|
+
export default function (this: Viz, d: DataPoint, i: number, x: DataPoint, event: MouseEvent & TouchEvent): void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
@module mouseMoveShape
|
|
5
|
+
Tooltip logic for a specified data point.
|
|
6
|
+
@param config Optional configuration methods for the Tooltip class.
|
|
7
|
+
@private
|
|
8
|
+
*/
|
|
9
|
+
export default function (this: Viz, d: DataPoint, i: number, x: DataPoint, event: MouseEvent & TouchEvent): void;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { DataPoint } from "@d3plus/data";
|
|
2
|
+
import type Viz from "../Viz.js";
|
|
3
|
+
/**
|
|
4
|
+
@module matrixData
|
|
5
|
+
@private
|
|
6
|
+
*/
|
|
7
|
+
export default function (this: Viz, _data?: DataPoint[]): {
|
|
8
|
+
rowValues: DataPoint[keyof DataPoint][];
|
|
9
|
+
columnValues: DataPoint[keyof DataPoint][];
|
|
10
|
+
shapeData: Record<string, unknown>[];
|
|
11
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export { default as AreaPlot } from "./AreaPlot.js";
|
|
2
|
+
export { default as BarChart } from "./BarChart.js";
|
|
3
|
+
export { default as BoxWhisker } from "./BoxWhisker.js";
|
|
4
|
+
export { default as BumpChart } from "./BumpChart.js";
|
|
5
|
+
export { default as Donut } from "./Donut.js";
|
|
6
|
+
export { default as Geomap } from "./Geomap.js";
|
|
7
|
+
export { default as LinePlot } from "./LinePlot.js";
|
|
8
|
+
export { default as Matrix } from "./Matrix.js";
|
|
9
|
+
export { default as Network } from "./Network.js";
|
|
10
|
+
export { default as Pack } from "./Pack.js";
|
|
11
|
+
export { default as Pie } from "./Pie.js";
|
|
12
|
+
export { default as Plot } from "./Plot.js";
|
|
13
|
+
export { default as Priestley } from "./Priestley.js";
|
|
14
|
+
export { default as Radar } from "./Radar.js";
|
|
15
|
+
export { default as RadialMatrix } from "./RadialMatrix.js";
|
|
16
|
+
export { default as Rings } from "./Rings.js";
|
|
17
|
+
export { default as Sankey } from "./Sankey.js";
|
|
18
|
+
export { default as StackedArea } from "./StackedArea.js";
|
|
19
|
+
export { default as Tree } from "./Tree.js";
|
|
20
|
+
export { default as Treemap } from "./Treemap.js";
|
|
21
|
+
export { default as Viz } from "./Viz.js";
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type Plot from "../Plot.js";
|
|
2
|
+
/**
|
|
3
|
+
@module barBuffer
|
|
4
|
+
Adds a buffer to either side of the non-discrete axis.
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
@param buffer @private
|
|
8
|
+
*/
|
|
9
|
+
export default function (this: Plot, { data, x, y, x2, y2, buffer, }: {
|
|
10
|
+
data: Record<string, unknown>[];
|
|
11
|
+
x: any;
|
|
12
|
+
y: any;
|
|
13
|
+
x2?: any;
|
|
14
|
+
y2?: any;
|
|
15
|
+
buffer?: number;
|
|
16
|
+
}): [unknown, unknown];
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type Plot from "../Plot.js";
|
|
2
|
+
/**
|
|
3
|
+
@module boxBuffer
|
|
4
|
+
Adds a buffer to either side of the non-discrete axis.
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
@param buffer @private
|
|
8
|
+
*/
|
|
9
|
+
export default function (this: Plot, { data, x, y, x2, y2, buffer, }: {
|
|
10
|
+
data: Record<string, unknown>[];
|
|
11
|
+
x: any;
|
|
12
|
+
y: any;
|
|
13
|
+
x2?: any;
|
|
14
|
+
y2?: any;
|
|
15
|
+
buffer?: number;
|
|
16
|
+
}): [unknown, unknown];
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type Plot from "../Plot.js";
|
|
2
|
+
/**
|
|
3
|
+
@module circleBuffer
|
|
4
|
+
Adds a buffer to either side of the non-discrete axis.
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
@param buffer Defaults to the radius of the largest Circle.
|
|
8
|
+
@private
|
|
9
|
+
*/
|
|
10
|
+
export default function (this: Plot, { data, x, y, x2, y2, yScale, xScale, config, buffer, }: {
|
|
11
|
+
data: Record<string, unknown>[];
|
|
12
|
+
x: any;
|
|
13
|
+
y: any;
|
|
14
|
+
x2?: any;
|
|
15
|
+
y2?: any;
|
|
16
|
+
yScale?: string;
|
|
17
|
+
xScale?: string;
|
|
18
|
+
config?: Record<string, (...args: unknown[]) => unknown>;
|
|
19
|
+
buffer?: number;
|
|
20
|
+
}): [unknown, unknown];
|