@orbcharts/core 3.0.0-beta.3 → 3.0.0-beta.4

package/dist/src/utils/d3Scale.d.ts

@@ -0,0 +1,28 @@
+import * as d3 from 'd3';
+export declare const createValueToAxisScale: ({ maxValue, minValue, axisWidth, scaleDomain, scaleRange, reverse }: {
+    maxValue: number;
+    minValue: number;
+    axisWidth: number;
+    scaleDomain: [number | "min" | "auto", number | "max" | "auto"];
+    scaleRange: [number, number];
+    reverse?: boolean;
+}) => d3.ScaleLinear<number, number, never>;
+export declare const createAxisToValueScale: ({ maxValue, minValue, axisWidth, scaleDomain, scaleRange, reverse }: {
+    maxValue: number;
+    minValue: number;
+    axisWidth: number;
+    scaleDomain: [number | "min" | "auto", number | "max" | "auto"];
+    scaleRange: [number, number];
+    reverse?: boolean;
+}) => d3.ScaleLinear<number, number, never>;
+export declare const createLabelToAxisScale: ({ axisLabels, axisWidth, padding }: {
+    axisLabels: string[];
+    axisWidth: number;
+    padding?: number;
+}) => d3.ScalePoint<string>;
+export declare const createAxisToLabelIndexScale: ({ axisLabels, axisWidth, padding, reverse }: {
+    axisLabels: string[] | Date[];
+    axisWidth: number;
+    padding?: number;
+    reverse?: boolean;
+}) => d3.ScaleQuantize<number, never>;

package/dist/src/utils/gridObservables.d.ts

@@ -1,28 +1,11 @@
 import { Observable } from 'rxjs';
-import { ComputedDataTypeMap, ComputedDataGrid, ComputedDatumGrid, DataFormatterTypeMap, DataFormatterGrid, ComputedLayoutDatumGrid, ComputedLayoutDataGrid, GridContainerPosition, Layout, TransformData } from '../../lib/core-types';
+import { ComputedDataTypeMap, ComputedDataGrid, ComputedDatumGrid, DataFormatterTypeMap, DataFormatterGrid, ComputedLayoutDatumGrid, ComputedLayoutDataGrid, ContainerPositionScaled, Layout, TransformData } from '../../lib/core-types';
 
 export declare const gridComputedLayoutDataObservable: ({ computedData$, fullDataFormatter$, layout$ }: {
     computedData$: Observable<ComputedDataTypeMap<"grid">>;
     fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
     layout$: Observable<Layout>;
 }) => Observable<ComputedLayoutDatumGrid[][]>;
-export declare const gridAxesTransformObservable: ({ fullDataFormatter$, layout$ }: {
-    fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
-    layout$: Observable<Layout>;
-}) => Observable<TransformData>;
-export declare const gridAxesReverseTransformObservable: ({ gridAxesTransform$ }: {
-    gridAxesTransform$: Observable<TransformData>;
-}) => Observable<TransformData>;
-export declare const gridGraphicTransformObservable: ({ computedData$, fullDataFormatter$, layout$ }: {
-    computedData$: Observable<ComputedDataTypeMap<"grid">>;
-    fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
-    layout$: Observable<Layout>;
-}) => Observable<TransformData>;
-export declare const gridGraphicReverseScaleObservable: ({ gridContainerPosition$, gridAxesTransform$, gridGraphicTransform$ }: {
-    gridContainerPosition$: Observable<GridContainerPosition[]>;
-    gridAxesTransform$: Observable<TransformData>;
-    gridGraphicTransform$: Observable<TransformData>;
-}) => Observable<[number, number][]>;
 export declare const gridAxesSizeObservable: ({ fullDataFormatter$, layout$ }: {
     fullDataFormatter$: Observable<DataFormatterGrid>;
     layout$: Observable<Layout>;
@@ -43,8 +26,35 @@ export declare const gridContainerPositionObservable: ({ computedData$, fullData
     computedData$: Observable<ComputedDataTypeMap<"grid">>;
     fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
     layout$: Observable<Layout>;
-}) => Observable<GridContainerPosition[]>;
+}) => Observable<ContainerPositionScaled[]>;
 export declare const computedStackedDataObservables: ({ isSeriesSeprate$, computedData$ }: {
     isSeriesSeprate$: Observable<boolean>;
     computedData$: Observable<ComputedDataGrid>;
 }) => Observable<ComputedDataGrid>;
+export declare const groupScaleDomainValueObservable: ({ computedData$, fullDataFormatter$ }: {
+    computedData$: Observable<ComputedDataGrid>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
+}) => Observable<[number, number]>;
+export declare const filteredMinMaxValueObservable: ({ computedData$, groupScaleDomainValue$ }: {
+    computedData$: Observable<ComputedDataGrid>;
+    groupScaleDomainValue$: Observable<[number, number]>;
+}) => Observable<[number, number]>;
+export declare const gridAxesTransformObservable: ({ fullDataFormatter$, layout$ }: {
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
+    layout$: Observable<Layout>;
+}) => Observable<TransformData>;
+export declare const gridAxesReverseTransformObservable: ({ gridAxesTransform$ }: {
+    gridAxesTransform$: Observable<TransformData>;
+}) => Observable<TransformData>;
+export declare const gridGraphicTransformObservable: ({ computedData$, groupScaleDomainValue$, filteredMinMaxValue$, fullDataFormatter$, layout$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"grid">>;
+    groupScaleDomainValue$: Observable<[number, number]>;
+    filteredMinMaxValue$: Observable<[number, number]>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"grid">>;
+    layout$: Observable<Layout>;
+}) => Observable<TransformData>;
+export declare const gridGraphicReverseScaleObservable: ({ gridContainerPosition$, gridAxesTransform$, gridGraphicTransform$ }: {
+    gridContainerPosition$: Observable<ContainerPositionScaled[]>;
+    gridAxesTransform$: Observable<TransformData>;
+    gridGraphicTransform$: Observable<TransformData>;
+}) => Observable<[number, number][]>;

package/dist/src/utils/index.d.ts

@@ -1,5 +1,5 @@
 export * from './commonUtils';
-export * from './d3Utils';
+export * from './d3Scale';
 export * from './gridObservables';
 export * from './multiGridObservables';
 export * from './observables';

package/dist/src/utils/multiGridObservables.d.ts

@@ -1,5 +1,5 @@
 import { Subject, Observable } from 'rxjs';
-import { ChartParams, ComputedDataTypeMap, ContextObserverMultiGridDetail, DataFormatterTypeMap, EventMultiGrid, GridContainerPosition, Layout } from '../../lib/core-types';
+import { ChartParams, ComputedDataTypeMap, ContextObserverMultiGridDetail, DataFormatterTypeMap, EventMultiGrid, ContainerPositionScaled, Layout } from '../../lib/core-types';
 
 export declare const multiGridEachDetailObservable: ({ fullDataFormatter$, computedData$, layout$, fullChartParams$, event$ }: {
     fullDataFormatter$: Observable<DataFormatterTypeMap<"multiGrid">>;
@@ -12,4 +12,4 @@ export declare const multiGridContainerObservable: ({ computedData$, fullDataFor
     computedData$: Observable<ComputedDataTypeMap<"multiGrid">>;
     fullDataFormatter$: Observable<DataFormatterTypeMap<"multiGrid">>;
     layout$: Observable<Layout>;
-}) => Observable<GridContainerPosition[][]>;
+}) => Observable<ContainerPositionScaled[][]>;

package/dist/src/utils/multiValueObservables.d.ts

@@ -0,0 +1,73 @@
+import { Observable } from 'rxjs';
+import { ComputedDataTypeMap, ComputedDatumMultiValue, DataFormatterTypeMap, ComputedLayoutDatumMultiValue, ComputedLayoutDataMultiValue, ContainerPositionScaled, Layout, TransformData } from '../../lib/core-types';
+
+export declare const minMaxXYObservable: ({ computedData$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"multiValue">>;
+}) => Observable<{
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+}>;
+export declare const multiValueComputedLayoutDataObservable: ({ computedData$, minMaxXY$, fullDataFormatter$, layout$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"multiValue">>;
+    minMaxXY$: Observable<{
+        minX: number;
+        maxX: number;
+        minY: number;
+        maxY: number;
+    }>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"multiValue">>;
+    layout$: Observable<Layout>;
+}) => Observable<ComputedLayoutDataMultiValue>;
+export declare const multiValueCategoryLabelsObservable: ({ computedData$, fullDataFormatter$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"multiValue">>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"multiValue">>;
+}) => Observable<string[]>;
+export declare const multiValueVisibleComputedDataObservable: ({ computedData$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"multiValue">>;
+}) => Observable<ComputedDatumMultiValue[][]>;
+export declare const multiValueVisibleComputedLayoutDataObservable: ({ computedLayoutData$ }: {
+    computedLayoutData$: Observable<ComputedLayoutDataMultiValue>;
+}) => Observable<ComputedLayoutDatumMultiValue[][]>;
+export declare const multiValueContainerPositionObservable: ({ computedData$, fullDataFormatter$, layout$ }: {
+    computedData$: Observable<ComputedDataTypeMap<"multiValue">>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"multiValue">>;
+    layout$: Observable<Layout>;
+}) => Observable<ContainerPositionScaled[]>;
+export declare const filteredMinMaxXYDataObservable: ({ visibleComputedLayoutData$, minMaxXY$, fullDataFormatter$ }: {
+    visibleComputedLayoutData$: Observable<ComputedLayoutDataMultiValue>;
+    minMaxXY$: Observable<{
+        minX: number;
+        maxX: number;
+        minY: number;
+        maxY: number;
+    }>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"multiValue">>;
+}) => Observable<{
+    datumList: ComputedLayoutDatumMultiValue[];
+    minXDatum: ComputedLayoutDatumMultiValue;
+    maxXDatum: ComputedLayoutDatumMultiValue;
+    minYDatum: ComputedLayoutDatumMultiValue;
+    maxYDatum: ComputedLayoutDatumMultiValue;
+}>;
+export declare const multiValueGraphicTransformObservable: ({ minMaxXY$, filteredMinMaxXYData$, fullDataFormatter$, layout$ }: {
+    minMaxXY$: Observable<{
+        minX: number;
+        maxX: number;
+        minY: number;
+        maxY: number;
+    }>;
+    filteredMinMaxXYData$: Observable<{
+        minXDatum: ComputedLayoutDatumMultiValue;
+        maxXDatum: ComputedLayoutDatumMultiValue;
+        minYDatum: ComputedLayoutDatumMultiValue;
+        maxYDatum: ComputedLayoutDatumMultiValue;
+    }>;
+    fullDataFormatter$: Observable<DataFormatterTypeMap<"multiValue">>;
+    layout$: Observable<Layout>;
+}) => Observable<TransformData>;
+export declare const multiValueGraphicReverseScaleObservable: ({ multiValueContainerPosition$, multiValueGraphicTransform$ }: {
+    multiValueContainerPosition$: Observable<ContainerPositionScaled[]>;
+    multiValueGraphicTransform$: Observable<TransformData>;
+}) => Observable<[number, number][]>;

package/dist/src/utils/orbchartsUtils.d.ts

@@ -1,9 +1,10 @@
-import { ChartType, ChartParams, DatumValue, DataSeries, DataGrid, DataGridDatum, DataMultiGrid, DataMultiValue, DataFormatterContainer, SeriesDirection, DataFormatterGridGrid, SeriesContainerPosition, GridContainerPosition, Layout } from '../../lib/core-types';
+import { ChartType, ChartParams, DatumValue, DataSeries, DataGrid, DataGridDatum, DataMultiGrid, DataMultiValue, ComputedLayoutDatumMultiValue, DataFormatterContainer, SeriesDirection, DataFormatterGridGrid, ContainerPosition, ContainerPositionScaled, Layout } from '../../lib/core-types';
 import * as d3 from 'd3';
 export declare function formatValueToLabel(value: any, valueFormatter: string | ((text: d3.NumberValue) => string)): string;
-export declare function createDefaultDatumId(chartTypeOrPrefix: string, levelOneIndex: number, levelTwoIndex: number, levelThreeIndex?: number): string;
+export declare function createDefaultDatumId(chartTypeOrPrefix: string, levelOneIndex: number, levelTwoIndex?: number, levelThreeIndex?: number): string;
 export declare function createDefaultSeriesLabel(chartTypeOrPrefix: string, seriesIndex: number): string;
 export declare function createDefaultGroupLabel(chartTypeOrPrefix: string, groupIndex: number): string;
+export declare function createDefaultCategoryLabel(): string;
 export declare function createGridSeriesLabels({ transposedDataGrid, dataFormatterGrid, chartType }: {
     transposedDataGrid: DataGridDatum[][];
     dataFormatterGrid: DataFormatterGridGrid;
@@ -31,8 +32,21 @@ export declare function getMinAndMaxValue(data: DatumValue[]): [number, number];
 export declare function getMinAndMaxSeries(data: DataSeries): [number, number];
 export declare function getMinAndMaxGrid(data: DataGrid): [number, number];
 export declare function getMinAndMaxMultiGrid(data: DataMultiGrid): [number, number];
-export declare function getMinAndMaxMultiValue(data: DataMultiValue, valueIndex?: number): [number, number];
+export declare function getMinAndMaxMultiValue(data: DataMultiValue, valueIndex: number): [number, number];
+export declare function getMinAndMaxMultiValueXY({ data, minX, maxX, minY, maxY }: {
+    data: ComputedLayoutDatumMultiValue[][];
+    minX: number;
+    maxX: number;
+    minY: number;
+    maxY: number;
+}): {
+    minXDatum: ComputedLayoutDatumMultiValue;
+    maxXDatum: ComputedLayoutDatumMultiValue;
+    minYDatum: ComputedLayoutDatumMultiValue;
+    maxYDatum: ComputedLayoutDatumMultiValue;
+    filteredData: ComputedLayoutDatumMultiValue[][];
+};
 export declare function transposeData<T>(seriesDirection: SeriesDirection, data: T[][]): T[][];
 export declare function seriesColorPredicate(seriesIndex: number, chartParams: ChartParams): string;
-export declare function calcSeriesContainerLayout(layout: Layout, container: DataFormatterContainer, amount: number): SeriesContainerPosition[];
-export declare function calcGridContainerLayout(layout: Layout, container: DataFormatterContainer, amount: number): GridContainerPosition[];
+export declare function calcSeriesContainerLayout(layout: Layout, container: DataFormatterContainer, amount: number): ContainerPosition[];
+export declare function calcGridContainerLayout(layout: Layout, container: DataFormatterContainer, amount: number): ContainerPositionScaled[];

package/dist/src/utils/seriesObservables.d.ts

@@ -1,5 +1,5 @@
 import { Observable } from 'rxjs';
-import { ComputedDatumSeries, ComputedDataTypeMap, DataFormatterTypeMap, SeriesContainerPosition, Layout } from '../../lib/core-types';
+import { ComputedDatumSeries, ComputedDataTypeMap, DataFormatterTypeMap, ContainerPosition, Layout } from '../../lib/core-types';
 
 export declare const separateSeriesObservable: ({ fullDataFormatter$ }: {
     fullDataFormatter$: Observable<DataFormatterTypeMap<"series">>;
@@ -18,9 +18,9 @@ export declare const seriesContainerPositionObservable: ({ computedData$, fullDa
     computedData$: Observable<ComputedDataTypeMap<"series">>;
     fullDataFormatter$: Observable<DataFormatterTypeMap<"series">>;
     layout$: Observable<Layout>;
-}) => Observable<SeriesContainerPosition[]>;
+}) => Observable<ContainerPosition[]>;
 export declare const seriesContainerPositionMapObservable: ({ seriesContainerPosition$, seriesLabels$, separateSeries$ }: {
-    seriesContainerPosition$: Observable<SeriesContainerPosition[]>;
+    seriesContainerPosition$: Observable<ContainerPosition[]>;
     seriesLabels$: Observable<string[]>;
     separateSeries$: Observable<boolean>;
-}) => Observable<Map<string, SeriesContainerPosition>>;
+}) => Observable<Map<string, ContainerPosition>>;

package/dist/src/utils/treeObservables.d.ts

@@ -1,13 +1,10 @@
 import { Observable } from 'rxjs';
-import { ComputedDataTree, DataFormatterTree } from '../../lib/core-types';
+import { ComputedDataTree } from '../../lib/core-types';
 
 export declare const nodeListObservable: ({ computedData$ }: {
     computedData$: Observable<ComputedDataTree>;
 }) => Observable<ComputedDataTree[]>;
-export declare const existCategoryLabelsObservable: ({ nodeList$, fullDataFormatter$ }: {
-    nodeList$: Observable<ComputedDataTree[]>;
-    fullDataFormatter$: Observable<DataFormatterTree>;
-}) => Observable<string[]>;
+export declare const categoryLabelsObservable: (CategoryDataMap$: Observable<Map<string, ComputedDataTree[]>>) => Observable<string[]>;
 export declare const treeVisibleComputedDataObservable: ({ computedData$ }: {
     computedData$: Observable<ComputedDataTree>;
 }) => Observable<ComputedDataTree>;

package/lib/core-types.ts

@@ -1,7 +1,7 @@
-
-
-export * from '@orbcharts/core-types'
-
-// test
-// export * from '../../orbcharts-core-types/src'
-
+
+
+export * from '@orbcharts/core-types'
+
+// test
+// export * from '../../orbcharts-core-types/src'
+

package/package.json

@@ -1,42 +1,42 @@
-{
-  "name": "@orbcharts/core",
-  "version": "3.0.0-beta.3",
-  "description": "OrbCharts is an open source chart library based on d3.js and rx.js",
-  "author": "Blue Planet Inc.",
-  "license": "Apache-2.0",
-  "keywords": [
-    "d3",
-    "rxjs",
-    "svg",
-    "visualization",
-    "infographic",
-    "graph",
-    "chart"
-  ],
-  "private": false,
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/"
-  },
-  "files": [
-    "*"
-  ],
-  "module": "./dist/orbcharts-core.es.js",
-  "types": "./dist/src/index.d.ts",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "vite build --mode production"
-  },
-  "devDependencies": {
-    "@types/d3": "^7.4.0",
-    "ts-loader": "^9.4.2",
-    "typescript": "^5.0.4",
-    "vite": "^5.3.5",
-    "vite-plugin-dts": "^3.7.3"
-  },
-  "dependencies": {
-    "@orbcharts/core-types": "^3.0.0-beta.2",
-    "d3": "^7.8.5",
-    "rxjs": "^7.8.1"
-  }
-}
+{
+  "name": "@orbcharts/core",
+  "version": "3.0.0-beta.4",
+  "description": "OrbCharts is an open source chart library based on d3.js and rx.js",
+  "author": "Blue Planet Inc.",
+  "license": "Apache-2.0",
+  "keywords": [
+    "d3",
+    "rxjs",
+    "svg",
+    "visualization",
+    "infographic",
+    "graph",
+    "chart"
+  ],
+  "private": false,
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "*"
+  ],
+  "module": "./dist/orbcharts-core.es.js",
+  "types": "./dist/src/index.d.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "vite build --mode production"
+  },
+  "devDependencies": {
+    "@types/d3": "^7.4.0",
+    "ts-loader": "^9.4.2",
+    "typescript": "^5.0.4",
+    "vite": "^5.3.5",
+    "vite-plugin-dts": "^3.7.3"
+  },
+  "dependencies": {
+    "@orbcharts/core-types": "^3.0.0-beta.3",
+    "d3": "^7.8.5",
+    "rxjs": "^7.8.1"
+  }
+}

package/src/AbstractChart.ts

@@ -1,57 +1,57 @@
-import * as d3 from 'd3'
-import {
-  Subject } from 'rxjs'
-import type {
-  ComputedDataFn,
-  DataValidator,
-  ChartEntity,
-  ChartType,
-  ChartParamsPartial,
-  ContextObserverCallback,
-  ChartOptionsPartial,
-  DataTypeMap,
-  DataFormatterTypeMap,
-  DataFormatterPartialTypeMap,
-  DataFormatterValidator,
-  EventTypeMap,
-  PluginEntity } from '../lib/core-types'
-import { createBaseChart } from './base/createBaseChart'
-import { createOrbChartsErrorMessage } from './utils/errorMessage'
-
-export abstract class AbstractChart<T extends ChartType> implements ChartEntity<T> {
-  selection: d3.Selection<SVGGElement, unknown, HTMLElement, unknown>
-  destroy: () => void
-  data$: Subject<DataTypeMap<T>> = new Subject()
-  dataFormatter$: Subject<DataFormatterPartialTypeMap<T>> = new Subject()
-  plugins$: Subject<PluginEntity<T, any, any>[]> = new Subject()
-  chartParams$: Subject<ChartParamsPartial> = new Subject()
-  event$: Subject<EventTypeMap<T>> = new Subject()
-
-  constructor (
-    { defaultDataFormatter, dataFormatterValidator, computedDataFn, dataValidator, contextObserverCallback }: {
-      defaultDataFormatter: DataFormatterTypeMap<T>
-      dataFormatterValidator: DataFormatterValidator<T>
-      computedDataFn: ComputedDataFn<T>
-      dataValidator: DataValidator<T>
-      contextObserverCallback: ContextObserverCallback<T>
-    },
-    element: HTMLElement | Element,
-    options?: ChartOptionsPartial<T>
-  ) {
-    try {
-      const baseChart = createBaseChart({ defaultDataFormatter, dataFormatterValidator, computedDataFn, dataValidator, contextObserverCallback })
-      const chartEntity = baseChart(element, options)
-
-      this.selection = chartEntity.selection
-      this.destroy = chartEntity.destroy
-      this.data$ = chartEntity.data$
-      this.dataFormatter$ = chartEntity.dataFormatter$
-      this.plugins$ = chartEntity.plugins$
-      this.chartParams$ = chartEntity.chartParams$
-      this.event$ = chartEntity.event$
-    } catch (e) {
-      console.error(createOrbChartsErrorMessage(e))
-    }
-  }
-  
-}
+import * as d3 from 'd3'
+import {
+  Subject } from 'rxjs'
+import type {
+  ComputedDataFn,
+  DataValidator,
+  ChartEntity,
+  ChartType,
+  ChartParamsPartial,
+  ContextObserverCallback,
+  ChartOptionsPartial,
+  DataTypeMap,
+  DataFormatterTypeMap,
+  DataFormatterPartialTypeMap,
+  DataFormatterValidator,
+  EventTypeMap,
+  PluginEntity } from '../lib/core-types'
+import { createBaseChart } from './base/createBaseChart'
+import { createOrbChartsErrorMessage } from './utils/errorMessage'
+
+export abstract class AbstractChart<T extends ChartType> implements ChartEntity<T> {
+  selection: d3.Selection<SVGGElement, unknown, HTMLElement, unknown>
+  destroy: () => void
+  data$: Subject<DataTypeMap<T>> = new Subject()
+  dataFormatter$: Subject<DataFormatterPartialTypeMap<T>> = new Subject()
+  plugins$: Subject<PluginEntity<T, any, any>[]> = new Subject()
+  chartParams$: Subject<ChartParamsPartial> = new Subject()
+  event$: Subject<EventTypeMap<T>> = new Subject()
+
+  constructor (
+    { defaultDataFormatter, dataFormatterValidator, computedDataFn, dataValidator, contextObserverCallback }: {
+      defaultDataFormatter: DataFormatterTypeMap<T>
+      dataFormatterValidator: DataFormatterValidator<T>
+      computedDataFn: ComputedDataFn<T>
+      dataValidator: DataValidator<T>
+      contextObserverCallback: ContextObserverCallback<T>
+    },
+    element: HTMLElement | Element,
+    options?: ChartOptionsPartial<T>
+  ) {
+    try {
+      const baseChart = createBaseChart({ defaultDataFormatter, dataFormatterValidator, computedDataFn, dataValidator, contextObserverCallback })
+      const chartEntity = baseChart(element, options)
+
+      this.selection = chartEntity.selection
+      this.destroy = chartEntity.destroy
+      this.data$ = chartEntity.data$
+      this.dataFormatter$ = chartEntity.dataFormatter$
+      this.plugins$ = chartEntity.plugins$
+      this.chartParams$ = chartEntity.chartParams$
+      this.event$ = chartEntity.event$
+    } catch (e) {
+      console.error(createOrbChartsErrorMessage(e))
+    }
+  }
+  
+}

package/src/GridChart.ts

@@ -1,25 +1,25 @@
-import type {
-  ChartEntity,
-  ChartOptionsPartial } from '../lib/core-types'
-import { DATA_FORMATTER_GRID_DEFAULT } from './defaults'
-import { dataFormatterValidator } from './grid/dataFormatterValidator'
-import { computedDataFn } from './grid/computedDataFn'
-import { dataValidator } from './grid/dataValidator'
-import { contextObserverCallback } from './grid/contextObserverCallback'
-import { AbstractChart } from './AbstractChart'
-
-export class GridChart extends AbstractChart<'grid'> implements ChartEntity<'grid'> {
-  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'grid'>) {
-    super(
-      {
-        defaultDataFormatter: DATA_FORMATTER_GRID_DEFAULT,
-        dataFormatterValidator,
-        computedDataFn,
-        dataValidator,
-        contextObserverCallback
-      },
-      element,
-      options
-    )
-  }
+import type {
+  ChartEntity,
+  ChartOptionsPartial } from '../lib/core-types'
+import { DATA_FORMATTER_GRID_DEFAULT } from './defaults'
+import { dataFormatterValidator } from './grid/dataFormatterValidator'
+import { computedDataFn } from './grid/computedDataFn'
+import { dataValidator } from './grid/dataValidator'
+import { contextObserverCallback } from './grid/contextObserverCallback'
+import { AbstractChart } from './AbstractChart'
+
+export class GridChart extends AbstractChart<'grid'> implements ChartEntity<'grid'> {
+  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'grid'>) {
+    super(
+      {
+        defaultDataFormatter: DATA_FORMATTER_GRID_DEFAULT,
+        dataFormatterValidator,
+        computedDataFn,
+        dataValidator,
+        contextObserverCallback
+      },
+      element,
+      options
+    )
+  }
 }

package/src/MultiGridChart.ts

@@ -1,25 +1,25 @@
-import type {
-  ChartEntity,
-  ChartOptionsPartial } from '../lib/core-types'
-import { DATA_FORMATTER_MULTI_GRID_DEFAULT } from './defaults'
-import { dataFormatterValidator } from './multiGrid/dataFormatterValidator'
-import { computedDataFn } from './multiGrid/computedDataFn'
-import { dataValidator } from './multiGrid/dataValidator'
-import { contextObserverCallback } from './multiGrid/contextObserverCallback'
-import { AbstractChart } from './AbstractChart'
-
-export class MultiGridChart extends AbstractChart<'multiGrid'> implements ChartEntity<'multiGrid'> {
-  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'multiGrid'>) {
-    super(
-      {
-        defaultDataFormatter: DATA_FORMATTER_MULTI_GRID_DEFAULT,
-        dataFormatterValidator,
-        computedDataFn,
-        dataValidator,
-        contextObserverCallback
-      },
-      element,
-      options
-    )
-  }
+import type {
+  ChartEntity,
+  ChartOptionsPartial } from '../lib/core-types'
+import { DATA_FORMATTER_MULTI_GRID_DEFAULT } from './defaults'
+import { dataFormatterValidator } from './multiGrid/dataFormatterValidator'
+import { computedDataFn } from './multiGrid/computedDataFn'
+import { dataValidator } from './multiGrid/dataValidator'
+import { contextObserverCallback } from './multiGrid/contextObserverCallback'
+import { AbstractChart } from './AbstractChart'
+
+export class MultiGridChart extends AbstractChart<'multiGrid'> implements ChartEntity<'multiGrid'> {
+  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'multiGrid'>) {
+    super(
+      {
+        defaultDataFormatter: DATA_FORMATTER_MULTI_GRID_DEFAULT,
+        dataFormatterValidator,
+        computedDataFn,
+        dataValidator,
+        contextObserverCallback
+      },
+      element,
+      options
+    )
+  }
 }

package/src/MultiValueChart.ts

@@ -1,25 +1,25 @@
-import type {
-  ChartEntity,
-  ChartOptionsPartial } from '../lib/core-types'
-import { DATA_FORMATTER_MULTI_VALUE_DEFAULT } from './defaults'
-import { dataFormatterValidator } from './multiValue/dataFormatterValidator'
-import { computedDataFn } from './multiValue/computedDataFn'
-import { dataValidator } from './multiValue/dataValidator'
-import { contextObserverCallback } from './multiValue/contextObserverCallback'
-import { AbstractChart } from './AbstractChart'
-
-export class MultiValueChart extends AbstractChart<'multiValue'> implements ChartEntity<'multiValue'> {
-  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'multiValue'>) {
-    super(
-      {
-        defaultDataFormatter: DATA_FORMATTER_MULTI_VALUE_DEFAULT,
-        dataFormatterValidator,
-        computedDataFn,
-        dataValidator,
-        contextObserverCallback
-      },
-      element,
-      options
-    )
-  }
+import type {
+  ChartEntity,
+  ChartOptionsPartial } from '../lib/core-types'
+import { DATA_FORMATTER_MULTI_VALUE_DEFAULT } from './defaults'
+import { dataFormatterValidator } from './multiValue/dataFormatterValidator'
+import { computedDataFn } from './multiValue/computedDataFn'
+import { dataValidator } from './multiValue/dataValidator'
+import { contextObserverCallback } from './multiValue/contextObserverCallback'
+import { AbstractChart } from './AbstractChart'
+
+export class MultiValueChart extends AbstractChart<'multiValue'> implements ChartEntity<'multiValue'> {
+  constructor (element: HTMLElement | Element, options?: ChartOptionsPartial<'multiValue'>) {
+    super(
+      {
+        defaultDataFormatter: DATA_FORMATTER_MULTI_VALUE_DEFAULT,
+        dataFormatterValidator,
+        computedDataFn,
+        dataValidator,
+        contextObserverCallback
+      },
+      element,
+      options
+    )
+  }
 }