@reside-ic/skadi-chart 1.1.13 → 1.1.15

package/README.md

@@ -282,3 +282,12 @@ any functions that will remove layers after the chart is appended to the DOM.
 The pattern we use for reactivity outside of the scope of lifecycle hooks is to recreate the
 chart from scratch. The `appendTo` function will remove anything inside the chart `div` and
 append the new `Chart` into it. To see examples of reactivity see [here](./src/demo/App.vue).
+
+### Note for performance regarding reactivity
+
+Proxy objects can degrade performance. Frameworks like Vue proxy objects for reactivity or
+you may be manually creating them. Skadi chart does not modify arguments passed into it
+(i.e. does not use setters for any argument) however, Skadi chart does use getters many times
+as different layers scan your arguments, particularly your data. If you are experiencing
+performance issues, make sure to remove the proxy or remove getters. For example, in Vue
+you can use `markRaw` or `shallowRef` to prevent Vue from creating deep proxy objects.

package/dist/skadi-chart.d.ts

@@ -6,6 +6,7 @@ declare module "d3" {
     export { create, type BaseType, type Selection, type ClientPointEvent, pointer } from "d3-selection";
     export { brush, type D3BrushEvent } from "d3-brush";
     export { scaleBand, scaleLinear, scaleLog, type NumberValue, type ScaleBand, type ScaleContinuousNumeric } from "d3-scale";
+    export { format } from "d3-format";
 }
 declare module "types" {
     import { ChartOptions } from "Chart";
@@ -137,22 +138,51 @@ declare module "layers/Layer" {
     }
     export type LifecycleHooks = Omit<OptionalLayer, "type" | "properties" | "draw">;
 }
+declare module "layers/ScatterLayer" {
+    import { LayerArgs, ScatterPoints } from "types";
+    import { LayerType, OptionalLayer } from "layers/Layer";
+    export class ScatterLayer<Metadata> extends OptionalLayer {
+        points: ScatterPoints<Metadata>;
+        type: LayerType;
+        constructor(points: ScatterPoints<Metadata>);
+        draw: (layerArgs: LayerArgs) => void;
+    }
+}
+declare module "layers/TracesLayer" {
+    import { LayerArgs, Lines, Point, ZoomExtents } from "types";
+    import { LayerType, OptionalLayer } from "layers/Layer";
+    export type TracesOptions = {
+        RDPEpsilon: number | null;
+    };
+    export const RDPAlgorithm: (linesSC: Point[][], epsilon: number) => Point[][];
+    export class TracesLayer<Metadata> extends OptionalLayer {
+        linesDC: Lines<Metadata>;
+        options: TracesOptions;
+        type: LayerType;
+        private traces;
+        lowResLinesSC: Point[][];
+        getNewPoint: null | ((x: number, y: number, t: number) => Point);
+        getNewPointInverse: null | ((x: number, y: number, t: number) => Point);
+        constructor(linesDC: Lines<Metadata>, options: TracesOptions);
+        private customTween;
+        private updateLowResLinesSC;
+        draw: (layerArgs: LayerArgs, currentExtentsDC: ZoomExtents) => void;
+    }
+}
 declare module "helpers" {
-    import { LayerArgs, ScaleNumeric, XY, Point, Scales, AxisType, D3Selection } from "types";
+    import { ScatterLayer } from "layers/ScatterLayer";
+    import { TracesLayer } from "layers/TracesLayer";
+    import { LayerArgs, ScaleNumeric, XY, Point, Scales, AxisType, D3Selection, PointWithMetadata } from "types";
     export const customLineGen: (lineSC: Point[], layerArgs: LayerArgs) => string[];
     export const numScales: (bands: Partial<XY<string>> | undefined, layerArgs: LayerArgs) => XY<ScaleNumeric>;
-    export const getXYMinMax: (points: Point[]) => Scales;
+    export const getXYMinMax: <Metadata>(traceLayers: TracesLayer<Metadata>[], scatterLayers: ScatterLayer<Metadata>[]) => Scales;
     export const getSvgRectPath: (xStart: number, xEnd: number, yStart: number, yEnd: number) => string;
     export const mapScales: <T>(layerArgs: LayerArgs, callback: (scale: ScaleNumeric, axis: AxisType) => T) => [Record<string, T>, Record<string, Record<string, T>>];
     export const drawLine: (baseLayer: D3Selection<SVGGElement>, coordsSC: XY<{
         start: number;
         end: number;
     }>, color: string) => import("d3-selection").Selection<SVGLineElement, Point, null, undefined>;
-    export type DebounceConfig = {
-        timeout: NodeJS.Timeout | undefined;
-        time: number;
-    };
-    export const debounce: (cfg: DebounceConfig, callback: () => any) => void;
+    export const iterateOverPoints: <Metadata>(traceLayers: TracesLayer<Metadata>[], scatterLayers: ScatterLayer<Metadata>[], callback: (point: PointWithMetadata<Metadata>) => void) => void;
 }
 declare module "layers/AxesLayer" {
     import { LayerType, OptionalLayer } from "layers/Layer";
@@ -174,27 +204,6 @@ declare module "layers/AxesLayer" {
         private axisConfig;
     }
 }
-declare module "layers/TracesLayer" {
-    import { LayerArgs, Lines, Point, ZoomExtents } from "types";
-    import { LayerType, OptionalLayer } from "layers/Layer";
-    export type TracesOptions = {
-        RDPEpsilon: number | null;
-    };
-    export const RDPAlgorithm: (linesSC: Point[][], epsilon: number) => Point[][];
-    export class TracesLayer<Metadata> extends OptionalLayer {
-        linesDC: Lines<Metadata>;
-        options: TracesOptions;
-        type: LayerType;
-        private traces;
-        lowResLinesSC: Point[][];
-        getNewPoint: null | ((x: number, y: number, t: number) => Point);
-        getNewPointInverse: null | ((x: number, y: number, t: number) => Point);
-        constructor(linesDC: Lines<Metadata>, options: TracesOptions);
-        private customTween;
-        private updateLowResLinesSC;
-        draw: (layerArgs: LayerArgs, currentExtentsDC: ZoomExtents) => void;
-    }
-}
 declare module "layers/ZoomLayer" {
     import { LayerType, OptionalLayer } from "layers/Layer";
     import { D3Selection, LayerArgs } from "types";
@@ -215,16 +224,6 @@ declare module "layers/ZoomLayer" {
         draw: (layerArgs: LayerArgs) => void;
     }
 }
-declare module "layers/ScatterLayer" {
-    import { LayerArgs, ScatterPoints } from "types";
-    import { LayerType, OptionalLayer } from "layers/Layer";
-    export class ScatterLayer<Metadata> extends OptionalLayer {
-        points: ScatterPoints<Metadata>;
-        type: LayerType;
-        constructor(points: ScatterPoints<Metadata>);
-        draw: (layerArgs: LayerArgs) => void;
-    }
-}
 declare module "layers/TooltipsLayer" {
     import { LayerType, OptionalLayer } from "layers/Layer";
     import { AxisType, LayerArgs, PointWithMetadata } from "types";
@@ -302,6 +301,7 @@ declare module "Chart" {
             categorical?: Partial<XY<Partial<TickConfig<string>>>>;
         };
     };
+    export const defaultFormatter: (val: number) => string;
     export class Chart<Metadata = any> {
         id: string;
         optionalLayers: AllOptionalLayers[];