UNPKG

28.3 kBTypeScriptView Raw
1declare namespace Lib
2{
3
4/** Options for the library. */
5interface Options {
6
7 /** The URL for the webassembly binary (cvizzu.wasm). */
8 wasmUrl?: string;
9
10}
11
12}
13
14declare namespace Data
15{
16
17/** Additional info about a data series besides the contained data. */
18interface SeriesMetaInfo
19{
20 /** Name of the data series. It will be the unique id of the series to
21 reference it in various parts of the API, mainly in {@link Channel} and
22 {@link Data.Record}. This name will also be used by default for Axis and
23 Legend title. */
24 name: string;
25 /** Type of the data series:
26 - 'dimension' - categorical data containing strings
27 (dates should also be added as strings);
28 - 'measure' - continuous data containing numbers.
29 If not set, the library will attempt to determine the type based on
30 the type of the first value. Number type will result in measure,
31 string type will result in dimension. */
32 type?: 'dimension'|'measure';
33 /** Unit of the data series */
34 unit?: string;
35}
36
37interface AbstractSeriesInfo extends SeriesMetaInfo
38{
39 /** Count of values in the series. */
40 length: number;
41}
42
43/** Meta data about dimension data series */
44interface DimensionSeriesInfo extends AbstractSeriesInfo
45{
46 /** Distinct values in the series */
47 categories: Array<string>;
48}
49
50/** Meta data about measure data series */
51interface MeasureSeriesInfo extends AbstractSeriesInfo
52{
53 range: {
54 /** Minimal value in the series */
55 min: number;
56 /** Maximal value in the series */
57 max: number;
58 }
59}
60
61type SeriesInfo = DimensionSeriesInfo|MeasureSeriesInfo;
62
63/** Meta data about the data set */
64interface Metainfo
65{
66 series: SeriesInfo[];
67}
68
69/** Represents a categorical or data value */
70type Value = string|number;
71
72/** List of data values in a series. */
73type Values = string[]|number[];
74
75/** Defines a data series of the data set, and contains a particular variable's
76 values in the data set and meta info about the variable. */
77interface Series extends SeriesMetaInfo {
78 /** The array that contains the values of the data series. The value types
79 should match {@link Data.SeriesMetaInfo.type}. If the data series
80 is shorter than the longest data series defined, it will be internally
81 extended with empty values. */
82 values: Values;
83}
84
85/** A record of the data set, containing one value of each data series
86 corresponding to the same index. */
87interface Record {
88 /** Properties are provided for each data series, providing access to the value within
89 the record referenced by its {@link Data.Series.name|name}. */
90 [seriesName: Series["name"]]: Value;
91}
92
93type FilterCallback = (record: Record) => boolean;
94
95interface Filter {
96 /** A filter callback is called on each record of the dataset on chart
97 generation. If the callback returns false, the record will not be shown on the chart.
98 */
99 filter?: FilterCallback | null;
100}
101
102/** Data table specified by series. */
103interface TableBySeries extends Filter
104{
105 /** The series that make up the the data set. */
106 series: Series[];
107}
108
109/** Data table specified by records. */
110interface TableByRecords extends Filter
111{
112 /** The information about the data series in the records of the data set.
113 Note: not needed if it was previously specified. */
114 series?: SeriesMetaInfo[];
115 /** The array of data records that make up the data set. */
116 records: Value[][];
117}
118
119type CubeRow = Values|CubeRow[];
120
121/** Defines a data series of the data cube, and contains a particular variable's
122 values in the data cube and meta info about that variable. */
123interface CubeData extends SeriesMetaInfo {
124 /** A nested array that contains the values of the data series. Nesting
125 level should match the number of {@link Data.Cube.dimensions}. */
126 values: CubeRow;
127}
128
129/** N dimensional data cude */
130interface Cube extends Filter
131{
132 /** The list of the dimensions of the data cube. */
133 dimensions?: Series[];
134 /** The list of measures of the data cube. */
135 measures?: CubeData[];
136}
137
138/** Data set is a collection of related {@link Data.Series|data series}.
139 Each chart works on a single data set. */
140type Set = TableBySeries|TableByRecords|Cube;
141
142type SeriesList = string[]|string;
143
144}
145
146declare namespace Config
147{
148
149/* Units:
150 - no unit: the same unit as in the data;
151 - %: percentage relative to the min/max of the data;
152 - min,max: offset from min/max of the data;
153 - auto: automatic range based on chart config;
154 */
155type ChannelExtrema = number|`${number}%`|`${number}min`|`${number}max`|'auto';
156
157/** Channel range specifies how to scale the represented data. */
158interface ChannelRange {
159 min?: ChannelExtrema|null;
160 max?: ChannelExtrema|null;
161}
162
163/** Channels are the main building blocks of the chart. Each channel describes
164 a particular aspect of the markers (vertical & horizontal position, color, etc.)
165 and connects them to the underlying data. A single measure and an ordered list of
166 dimensions can be on each channel. The dimensions will recursively slice the
167 measure on the channel. The channels are represented on the chart as an
168 axis or legend. */
169interface Channel {
170 /** This title is shown on the axis or legend corresponding to the channel.
171 If 'auto', the title will be the name of the measure attached to
172 that channel. */
173 title?: string|'auto'|null;
174 /** List of {@link Data.Series.name|data series names} on the
175 channel. */
176 set? : Data.SeriesList|null;
177 /** List of {@link Data.Series.name|data series names} to be added to the
178 channel beside the ones already added. */
179 attach?: Data.SeriesList;
180 /** List of {@link Data.Series.name|data series names} to be removed from the
181 channel. */
182 detach?: Data.SeriesList;
183 /** Specifies the range that determines how the represented data scales
184 on the channel. */
185 range?: ChannelRange;
186 /** Only one dimension can be shown on an axis or legend by
187 name. This index specifies which attached series should be used. */
188 labelLevel?: number;
189 /** Enables the axis line on axis channels. */
190 axis?: 'auto'|boolean;
191 /** Enables the axis labels on axis channels. */
192 labels?: 'auto'|boolean;
193 /** Enables the axis ticks on axis channels showing measure data. */
194 ticks?: 'auto'|boolean;
195 /** Enables the interlacing on axis channels showing measure data. */
196 interlacing?: 'auto'|boolean;
197 /** Enables the grid lines on axis channels showing dimension data. */
198 guides?: 'auto'|boolean;
199 /** Enables the guide lines on axis channels showing measure data
200 * for all marker positions. */
201 markerGuides?: 'auto'|boolean;
202}
203
204/** Channel configuration.
205 A data series' name or a list of the data series' names can be used as a
206 short-hand - instead of the {@link Channel|channel object} - to set data series
207 for the channel. Setting a channel to null will remove all data series from it. */
208interface Channels {
209 /** Parameters for the X-axis, determining the position of the markers on the
210 x-axis - or their angle when using polar coordinates.
211 Note: leaving x and y channels empty will result in a
212 chart "without coordinates" like a Treemap or a Bubble Chart. */
213 x?: Channel|Data.SeriesList|null;
214 /** Parameters for the Y-axis, determining the position of the markers on the
215 y-axis - or their radius when using polar coordinates) . */
216 y?: Channel|Data.SeriesList|null;
217 /** Parameters for the markers' base color. The markers' actual color can
218 also be affected by the lightness channel. */
219 color?: Channel|Data.SeriesList|null;
220 /** Parameters for markers' lightness. */
221 lightness?: Channel|Data.SeriesList|null;
222 /** Parameters for the markers' size. Effective only for circle and line
223 geometry affecting the circle area or the line width respectively.
224 */
225 size?: Channel|Data.SeriesList|null;
226 /** Parameters for the content of the labels that appear on the markers. */
227 label?: Channel|Data.SeriesList|null;
228 /** Splits the markers as all the other channels, but have no
229 effect on the markers' appearance. Thus, it only works with dimensions. */
230 noop?: Channel|Data.SeriesList|null;
231}
232
233/** The config contains all of the parameters needed to render a particular
234 static chart or a state of an animated chart. */
235interface Chart extends Channels {
236 /** List of the chart's channels' configuration. The chart object also
237 extends the channels object as a configuration shorthand. */
238 channels?: Channels;
239 /** This is the title shown on the top of the chart.
240 If set to null, the title will not be shown and will not take up any
241 space in the chart layout. */
242 title?: string|null;
243 /** Specifies which channel should be shown on the legend.
244 If set to null, the legend will not be shown and will not take up any
245 space in the chart layout. */
246 legend?: 'color'|'lightness'|'size'|null;
247 /** Sets the coordinate system for the chart. Switch to the 'polar'
248 coordinate system to create a chart from the pie/radial chart family. */
249 coordSystem?: 'cartesian'|'polar';
250 /** Rotates the plot area by the specified angle in degree.
251 Note: this is an experimental, not tested feature. */
252 rotate?: number;
253 /** Sets the geometric elements used for the markers to represent the data.*/
254 geometry?: 'rectangle'|'circle'|'area'|'line';
255 /** If both axes have measures on them, this parameter sets the
256 orientation of the chart, meaning to which axis the graphical elements
257 are oriented to. */
258 orientation?: 'horizontal'|'vertical';
259 /** - 'none': markers are sorted in the order as the corresponding data
260 appear in the data set.
261 - 'byValue': markers will be sorted by the corresponding measure (if present)
262 in decreasing order. */
263 sort?: 'none'|'byValue';
264 /** Reverts the order of the markers if set. */
265 reverse?: boolean;
266 /** Sets the alignment of the markers with relation to the x- or the y-axis depending
267 on where the measure is. In case both axes have measures on them, this is determined
268 by the {@link Chart.orientation|orientation} of the chart.
269 */
270 align?: 'none'|'min'|'center'|'max'|'stretch';
271 /** If set to true, markers will be split by the dimension(s) along the axis.
272 This works if you have at least one dimension and a measure on the same axis.In case
273 both axes have measures and dimension(s) on them, this is determined by the
274 {@link Chart.orientation|orientation} of the chart.*/
275 split?: boolean;
276}
277
278}
279
280declare namespace Styles
281{
282
283/** Length can be set in pixels or in percentage of the element or the element's
284 font size. Pixel is the default unit. */
285type Length = `${number}px`|`${number}%`|`${number}em`|number;
286
287/** Angle can be set in radians, degrees, gradians and turns.
288 Radians is the default unit. */
289type Angle = `${number}rad`|`${number}grad`|`${number}deg`|`${number}turn`
290 |number;
291
292/** The following CSS color formats are available:
293 rgb(), rgba(), #RRGGBB, #RRGGBBAA, #RGB. */
294type Color = `#${string}`
295 |`rgb(${number},${number},${number})`
296 |`rgba(${number},${number},${number},${number})`;
297
298interface Padding {
299 /** Top padding of the element. */
300 paddingTop?: Length|null;
301 /** Right padding of the element. */
302 paddingRight?: Length|null;
303 /** Bottom padding of the element. */
304 paddingBottom?: Length|null;
305 /** Left padding of the element. */
306 paddingLeft?: Length|null;
307}
308
309interface Font {
310 /** The family of the font. If not set, it inherits the root style font
311 family. */
312 fontFamily?: string|null;
313 /** The style of the font. */
314 fontStyle?: 'normal'|'italic'|'oblique'|null;
315 /** The weight of the font, numbers use the same scale as CSS. */
316 fontWeight?: 'normal'|'bold'|number|null;
317 /** The size of the font. Percentage values are relative to the root style font
318 size */
319 fontSize?: Length|null;
320}
321
322interface Box {
323 /** The background color of the element. */
324 backgroundColor?: Color|null;
325 /** The border color of the element. */
326 borderColor?: Color|null;
327 /** The border width of the element. */
328 borderWidth?: number|null;
329}
330
331interface Text {
332 /** The color of the displayed text. */
333 color?: Color|null;
334 /** The alignment of the displayed text. */
335 textAlign?: 'center'|'left'|'right'|null;
336 /** The background color of the displayed text. */
337 backgroundColor?: Color|null;
338 /** The format of the number. Only applicable for texts showing numerical
339 data such as marker and axis labels. 'grouped' uses thousand separators,
340 'prefixed' uses scientific notation. */
341 numberFormat?: 'none'|'grouped'|'prefixed'|null;
342 /** The maximum number of digits in fraction part if the text contains a
343 number. */
344 maxFractionDigits?: number|null;
345}
346
347/** The following CSS like filters can be used to alter the color:
348
349 - color: overrides the color.
350 - lightness: lightens or darkens the color; 0 means the original color, -1
351 means black, 1 means white.
352 - grayscale: desaturates the color. 0 means the original color, 1 means fully
353 desaturated.
354
355 none: no change.
356 */
357type ColorTransform = `color(${Color})`
358 | `lightness(${number})`
359 | `grayscale(${number})`
360 | `opacity(${number})`
361 | 'none';
362
363interface OrientedLabel extends Label {
364 /** Orientation of the label relatively to the axis or marker it is attached to. */
365 orientation?: 'normal'|'tangential'|'horizontal'|'vertical'|null;
366 /** Additional rotation of the label. */
367 angle?: Angle|null;
368}
369
370interface MarkerLabel extends OrientedLabel {
371 /** The label position relatively to the marker. */
372 position?: 'center'|'top'|'left'|'bottom'|'right'|null;
373 /** Defines the transformation used for calculating the label color
374 from the marker color. */
375 filter?: ColorTransform|null;
376 /** Sets the order of values on the label if both a measure and a dimension are
377 present. */
378 format?: 'measureFirst'|'dimensionsFirst'|null;
379}
380
381interface Guides {
382 /** The color of the guides.*/
383 color?: Color|null;
384 /** Line width of the guide in pixel. */
385 lineWidth?: number|null;
386}
387
388interface Tooltip extends Font, Box {
389 /** The layout of the tooltip text */
390 layout?: 'singleLine'|'multiLine';
391 /** The foreground color of the tooltip text */
392 color?: Color;
393 /** Color of the drop shadow */
394 shadowColor?: Color;
395 /** Corner radius for the info bubble */
396 borderRadius?: number;
397 /** Drop shadow distance from the info bubble */
398 dropShadow?: number;
399 /** Data point marker radius */
400 radius?: number;
401 /** Base size of the info bubble arrow */
402 arrowSize?: number;
403 /** Distance between the data point and the info bubble */
404 distance?: number;
405 /** Specifies the name of the data series dispalyed
406 at the first position on the tooltip */
407 seriesName?: string|null;
408}
409
410interface Logo extends Padding
411{
412 /** Width of the Vizzu logo */
413 width?: Length|null;
414 /** Color transformation applied on the colored Vizzu Logo */
415 filter?: ColorTransform|null;
416}
417
418interface DataPoint {
419 /** Color gradient used for the measure on the color channel.*/
420 colorGradient?: ColorGradient|null;
421 /** Color palette used for the dimension on the color channel.*/
422 colorPalette?: ColorPalette|null;
423 /** Lightness value associated with the minimum value of the lightness
424 channel's range. */
425 minLightness?: number|null;
426 /** Lightness value associated with the maximum value of the lightness
427 channel's range. */
428 maxLightness?: number|null;
429 /** Minimum of line width specified as proportion of plot area size.
430 e.g.: 0.01 means 1% of the width of the plot area. */
431 lineMinWidth?: number|null;
432 /** Maximum line width specified as proportion of plot area size.
433 e.g.: 0.01 means 1% of the width of the plot area. */
434 lineMaxWidth?: number|null;
435 /** Minimum circle radius specified as proportion of plot area size.
436 e.g.: 0.01 means 1% of the width of the plot area. */
437 circleMinRadius?: number|null;
438 /** Maximum circle radius specified as proportion of plot area size.
439 e.g.: 0.01 means 1% of the width of the plot area. */
440 circleMaxRadius?: number|null;
441 /** Spacing between bars/columns. The value specifies the size of the
442 spacing as a factor of the marker size.
443 e.g.: 0.1 means 10% of marker height/width depending on the chart's orientation. */
444 rectangleSpacing?: number|null;
445}
446
447interface Marker extends DataPoint {
448 /** Width of the marker border in pixels. */
449 borderWidth?: number|null;
450 /** Opacity of the marker border. */
451 borderOpacity?: number|null;
452 borderOpacityMode?: 'straight'|'premultiplied'|null;
453 /** Opacity of the marker fill color. */
454 fillOpacity?: number|null;
455 /** Style settings for guide lines drawn for the markers. */
456 guides?: Guides|null;
457 /** Style settings for the marker labels. */
458 label?: MarkerLabel|null;
459}
460
461 /** Style settings for the values shown on the axis to display the scale
462 being used or the categories along the axis.
463 Note: textAlign has no effect on the Axis label. */
464interface AxisLabel extends OrientedLabel {
465 /** Label position relatively to the plot. */
466 position?: 'axis'|'max-edge'|'min-edge'|null;
467 /** Label alignment relatively to the position on the plot. */
468 side?: 'positive'|'negative'|null;
469}
470
471 /** Style settings of the {@link Config.Channel.title|Axis title} */
472interface AxisTitle extends Label {
473 /** Title position relatively to the plot. */
474 position?: 'axis'|'min-edge'|'max-edge'|null;
475 /** Title alignment relatively to the position on the plot. */
476 side?: 'positive'|'upon'|'negative'|null;
477 /** Title position on the axis or edge. */
478 vposition?: 'begin'|'middle'|'end'|null;
479 /** Title alignment on the axis or edge. */
480 vside?: 'positive'|'upon'|'negative'|null;
481 /** The orientation of the title. */
482 orientation?: 'horizontal'|'vertical'|null;
483}
484
485interface Ticks {
486 /** Color of the ticks on the axis. */
487 color?: Color|null;
488 /** Line width of the ticks on the axis. */
489 lineWidth?: number|null;
490 /** Length of the ticks on the axis. */
491 length?: Length|null;
492 /** Position of the ticks on the axis relatively to the axis line. */
493 position?: 'outside'|'inside'|'center'|null;
494}
495interface Interlacing {
496 /** Color of the interlacing pattern. */
497 color?: Color|null;
498}
499
500interface Axis {
501 /** Color of the axis line. */
502 color?: Color|null;
503 /** Style parameters of the axis title. */
504 title?: AxisTitle|null;
505 /** Style parameters of the axis labels. */
506 label?: AxisLabel|null;
507 ticks?: Ticks|null;
508 guides?: Guides|null;
509 interlacing?: Interlacing|null;
510}
511
512interface Plot extends Padding, Box {
513 /** Style settings for the markers. */
514 marker?: Marker|null;
515 /** Style settings for the x-axis - or the angle when using polar coordinates. */
516 xAxis?: Axis|null;
517 /** Style settings for the y-axis - or the radius when using polar coordinates. */
518 yAxis?: Axis|null;
519 /** Controls drawing outside of the plot area. If hidden, clipping will be
520 set for the boundary of the coordinate system. */
521 overflow?: 'hidden'|'visible';
522}
523
524interface LegendMarker {
525 /** Shape of the legend marker. */
526 type?: 'circle'|'square'|null;
527 /** Size of the legend marker (diameter or side length). */
528 size?: Length|null;
529}
530
531interface Legend extends Padding, Box {
532 /** Width of the legend's boundary box. */
533 width?: Length|null;
534 /** Limit for the width of the boundary box. */
535 maxWidth?: Length|null;
536 /** Style settings for the legend's title. */
537 title?: Label|null;
538 /** Style settings for the labels on the legend. */
539 label?: Label|null;
540 marker?: LegendMarker|null;
541}
542
543 /** Color and position pairs separated by spaces,
544 where position is a number between 0 and 1. */
545type ColorStop = `${Color} ${number}`;
546
547/** Color gradient is specified by a comma separated list of ColorStops.
548 This is used when a measure is on the color channel. */
549type ColorGradient = ColorStop
550 | `${ColorStop},${ColorStop}`
551 | `${ColorStop},${ColorStop},${ColorStop}`
552 | `${ColorStop},${ColorStop},${ColorStop},${ColorStop}`
553 | `${ColorStop},${ColorStop},${ColorStop},${ColorStop},${ColorStop}`
554 | string;
555
556/** Color palette is a list of colors separated by spaces.
557 This is used when only dimensions are on the color channel*/
558type ColorPalette = Color
559 | `${Color} ${Color}`
560 | `${Color} ${Color} ${Color}`
561 | `${Color} ${Color} ${Color} ${Color}`
562 | `${Color} ${Color} ${Color} ${Color} ${Color}`
563 | string;
564
565type Label = Padding & Font & Text;
566
567interface Chart extends Padding, Box, Font {
568 /** Style settings for the plot area. */
569 plot?: Plot|null;
570 /** Style settings for the legend. */
571 legend?: Legend|null;
572 /** Style settings for the main chart title. */
573 title?: Label|null;
574 /** Style settings for the tooltip. */
575 tooltip?: Tooltip|null;
576 /** Style settings of the Vizzu logo. */
577 logo?: Logo|null;
578}
579
580}
581
582
583/** Represents a state in the animation describing the data, the chart, and
584 the style parameters to be changed from the actual state.
585 Passing null as style will reset every style parameter to default. */
586interface AnimTarget {
587 /** Data set. */
588 data?: Data.Set;
589 /** Chart configuration changes. */
590 config?: Config.Chart;
591 /** Style changes. */
592 style?: Styles.Chart|null;
593}
594
595declare namespace Anim
596{
597
598/** Duration can be set in seconds or milliseconds.
599 In case no unit is set, it defaults to seconds. */
600type Duration = `${number}s`|`${number}ms`|number;
601
602type Easing = 'none' | 'linear' | 'step-start' | 'step-end' | 'ease'
603 | 'ease-in' | 'ease-out' | 'ease-in-out'
604 | `cubic-bezier(${number},${number},${number},${number})`;
605
606/** Animation parameters for an animation group. */
607interface GroupOptions
608{
609 /** Sets the easing used for the animation. */
610 easing?: Easing;
611 /** The length of time an animation should take to complete. */
612 duration?: Duration;
613 /** Waiting time interval before the animation starts. */
614 delay?: Duration;
615}
616
617/** If no animation settings are passed to Vizzu, it will use an automatic
618 setting depending on the actual configuration of the chart. This behavior can be
619 overridden via the animation setting parameter.
620
621 The animation between two states of the chart can require the transitioning
622 of several different chart properties. These properties are grouped into
623 separately configurable animation groups.
624
625 The parameters can also be set for the animation as a whole. These settings
626 rescale the durations and delays of the animation groups to the
627 specified total delay and duration.
628 */
629interface Options extends GroupOptions {
630 /** Determines if the animation should start automatically after the
631 animate() call. */
632 playState?: 'paused'|'running';
633 /** The starting position of the animation. */
634 position: number;
635 /** Animation group for style parameters. */
636 style?: GroupOptions;
637 /** Title animation parameters. */
638 title?: GroupOptions;
639 /** Legend animation parameters. */
640 legend?: GroupOptions;
641 /** Animation group for new markers fading in
642 (due to filtering or added/removed data series). */
643 show?: GroupOptions;
644 /** Animation group for markers fading out
645 (due to filtering or added/removed data series). */
646 hide?: GroupOptions;
647 /** Marker color animation group. */
648 color?: GroupOptions;
649 /** Coordinate system transformations animation group. */
650 coordSystem?: GroupOptions;
651 /** Marker geometry morph animation group. */
652 geometry?: GroupOptions;
653 /** Animation group for marker transitions in the direction of the y-axis. */
654 y?: GroupOptions;
655 /** Animation group for marker transitions in the direction of the x-axis. */
656 x?: GroupOptions;
657 /** Animation group for tooltip transitions. */
658 tooltip?: GroupOptions;
659}
660
661/** Control object for animation. */
662interface Control extends Promise<Vizzu> {
663 /** Seeks the animation to the position specified by time or progress
664 percentage. Seeking the animation to the end position will not trigger
665 the (@link Vizzu.animate|animation promise) to resolve. */
666 seek(value: `${number}%`|Duration): void;
667 /** Pauses the controlled animation. */
668 pause(): void;
669 /** Plays/resumes playing of the controlled animation. */
670 play(): void;
671 /** Stops the current animation seeking it back to its start position. */
672 stop(): void;
673 /** Changes the direction of the controlled animation. */
674 reverse(): void;
675 /** Cancels the animation, will reject the animation promise. */
676 cancel(): void;
677}
678
679}
680
681declare namespace Event
682{
683
684type Type =
685 'click'
686 |'mouseon'
687 |'mousemove'
688 |'wheel'
689 |'update'
690 |'background-draw'
691 |'title-draw'
692 |'logo-draw'
693 |'legend-background-draw'
694 |'legend-title-draw'
695 |'legend-label-draw'
696 |'legend-marker-draw'
697 |'legend-bar-draw'
698 |'plot-background-draw'
699 |'plot-marker-draw'
700 |'plot-marker-label-draw'
701 |'plot-marker-guide-draw'
702 |'plot-axis-draw'
703 |'plot-axis-title-draw'
704 |'plot-axis-label-draw'
705 |'plot-axis-tick-draw'
706 |'plot-axis-guide-draw'
707 |'plot-axis-interlacing-draw'
708 |'animation-begin'
709 |'animation-complete';
710
711/** The interface of the event object is passed to event handlers by the library.
712 Additional properties will vary by event type. */
713interface Object {
714 /** If called, the default action of the event will be canceled. */
715 preventDefault: () => void;
716}
717
718}
719
720type Snapshot = number;
721
722/** List of base and additional features:
723 - logging: enables logging of the library to the console
724 (switched off by default).
725 - rendering: enables rendering of the library to the canvas
726 (enabled by default).
727 - tooltip: tooltips on the chart appearing on markers on mouse over.
728 Since the tooltip uses the animation interface, calling animate() while
729 the tooltip is enabled can cause unwanted behaviour. */
730type Feature = 'tooltip'|'logging'|'rendering';
731
732/** Class representing a single chart in Vizzu. */
733export default class Vizzu {
734 /** Creates a new chart and connects it to the div or canvas HTML
735 element specified by its ID or DOM object. The new chart is empty by
736 default, but can be set to an initial state in the second optional
737 parameter. */
738 constructor(container: string|HTMLElement, initState?: AnimTarget|Config.Chart);
739 /** Promise representing the initialization will resolve when
740 initialization is finished. Any API call will potentially cause
741 an error before this promise is resolved. */
742 initializing: Promise<Vizzu>;
743 /** Installs the provided event handler to the event specified by name. */
744 on(eventName: Event.Type, handler: (event: Event.Object) => void): void;
745 /** Uninstalls the provided event handler from the event specified by name.
746 */
747 off(eventName: Event.Type, handler: (event: Event.Object) => void): void;
748 /** Initiates the animation to the new chart state passed as the first
749 argument. If there is a currently running animation, all subsequent
750 calls will schedule the corresponding animation after the end of the
751 previous one.
752
753 The new chart state can be a full state specifier object with
754 data, config and style, or a single chart config object.
755 It accepts also a chart snapshot acquired from a previous state using
756 the store() method.
757
758 The optional second parameter specifies the animation
759 options. This second option can be a scalar value, setting the overall
760 animation duration. Passing explicit null as second parameter will
761 result in no animation.
762
763 The animation will be initiated in the next cycle of the JS event loop.
764 The method returns a promise, which will resolve when the animation is
765 finished. */
766 animate(
767 animTarget: AnimTarget|Config.Chart|Snapshot,
768 animOptions?: Anim.Options|Anim.Duration|null)
769 : Anim.Control;
770 /** Returns a reference to the actual chart state for further reuse.
771 This reference includes the chart config, style parameters and the
772 data filter but does not include the actual data and the animation options.
773 */
774 store(): Snapshot;
775 /** Returns controls for the ongoing animation, if any.
776 @deprecated since version 0.4.0 */
777 get animation(): Anim.Control;
778 /** Returns the version number of the library. */
779 version(): string;
780 /** Property for read-only access to style object. */
781 style: Readonly<Styles.Chart>;
782 /** Property for read-only access to chart parameter object. */
783 config: Readonly<Config.Chart>;
784 /** Property for read-only access to data metainfo object. */
785 data: Readonly<Data.Metainfo>;
786 /** Enable/disable additional features. */
787 feature(name: Feature, enabled: boolean): void;
788 /** Returns the chart preset collection. */
789 static get presets(): import('./presets').Preset;
790 /** Setter method for Library options. */
791 static options(options: Lib.Options): void;
792}