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

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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orbcharts/core",
-  "version": "3.0.0-beta.3",
+  "version": "3.0.0-beta.5",
   "description": "OrbCharts is an open source chart library based on d3.js and rx.js",
   "author": "Blue Planet Inc.",
   "license": "Apache-2.0",
@@ -35,7 +35,7 @@
     "vite-plugin-dts": "^3.7.3"
   },
   "dependencies": {
-    "@orbcharts/core-types": "^3.0.0-beta.2",
+    "@orbcharts/core-types": "^3.0.0-beta.4",
     "d3": "^7.8.5",
     "rxjs": "^7.8.1"
   }

package/src/defaults.ts

@@ -201,9 +201,12 @@ export const DATA_FORMATTER_MULTI_VALUE_DEFAULT: DataFormatterMultiValue = {
   type: 'multiValue',
   visibleFilter: (datum, context) => true,
   categoryLabels: [],
-  multiValue: [],
   xAxis: { ...DATA_FORMATTER_VALUE_AXIS_DEFAULT },
   yAxis: { ...DATA_FORMATTER_VALUE_AXIS_DEFAULT },
+  container: {
+    ...DATA_FORMATTER_CONTAINER_DEFAULT
+  },
+  separateCategory: false
 }
 DATA_FORMATTER_MULTI_VALUE_DEFAULT.visibleFilter.toString = () => `(datum, context) => true`
 

package/src/grid/contextObserverCallback.ts

@@ -7,17 +7,20 @@ import {
   textSizePxObservable } from '../utils/observables'
 import {
   gridComputedLayoutDataObservable,
-  gridAxesTransformObservable,
-  gridAxesReverseTransformObservable,
-  gridGraphicTransformObservable,
-  gridGraphicReverseScaleObservable,
   gridAxesSizeObservable,
   gridSeriesLabelsObservable,
   gridVisibleComputedDataObservable,
   gridVisibleComputedLayoutDataObservable,
   // isSeriesSeprateObservable,
   gridContainerPositionObservable,
-  computedStackedDataObservables } from '../utils/gridObservables'
+  computedStackedDataObservables,
+  groupScaleDomainValueObservable,
+  filteredMinMaxValueObservable,
+  gridAxesTransformObservable,
+  gridAxesReverseTransformObservable,
+  gridGraphicTransformObservable,
+  gridGraphicReverseScaleObservable,
+} from '../utils/gridObservables'
 
 export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subject, observer }) => {
   
@@ -37,33 +40,6 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     layout$: observer.layout$,
   })
 
-  const gridAxesTransform$ = gridAxesTransformObservable({
-    fullDataFormatter$: observer.fullDataFormatter$,
-    layout$: observer.layout$
-  }).pipe(
-    shareReplay(1)
-  )
-
-  const gridAxesReverseTransform$ = gridAxesReverseTransformObservable({
-    gridAxesTransform$
-  }).pipe(
-    shareReplay(1)
-  )
-  
-  const gridGraphicTransform$ = gridGraphicTransformObservable({
-    computedData$: observer.computedData$,
-    fullDataFormatter$: observer.fullDataFormatter$,
-    layout$: observer.layout$
-  }).pipe(
-    shareReplay(1)
-  )
-
-  const gridGraphicReverseScale$ = gridGraphicReverseScaleObservable({
-    gridContainerPosition$: gridContainerPosition$,
-    gridAxesTransform$: gridAxesTransform$,
-    gridGraphicTransform$: gridGraphicTransform$,
-  })
-
   const gridAxesSize$ = gridAxesSizeObservable({
     fullDataFormatter$: observer.fullDataFormatter$,
     layout$: observer.layout$
@@ -128,6 +104,49 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     shareReplay(1)
   )
 
+  const groupScaleDomainValue$ = groupScaleDomainValueObservable({
+    computedData$: observer.computedData$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const filteredMinMaxValue$ = filteredMinMaxValueObservable({
+    computedData$: observer.computedData$,
+    groupScaleDomainValue$: groupScaleDomainValue$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const gridAxesTransform$ = gridAxesTransformObservable({
+    fullDataFormatter$: observer.fullDataFormatter$,
+    layout$: observer.layout$
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const gridAxesReverseTransform$ = gridAxesReverseTransformObservable({
+    gridAxesTransform$
+  }).pipe(
+    shareReplay(1)
+  )
+  
+  const gridGraphicTransform$ = gridGraphicTransformObservable({
+    computedData$: observer.computedData$,
+    groupScaleDomainValue$: groupScaleDomainValue$,
+    filteredMinMaxValue$: filteredMinMaxValue$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    layout$: observer.layout$
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const gridGraphicReverseScale$ = gridGraphicReverseScaleObservable({
+    gridContainerPosition$: gridContainerPosition$,
+    gridAxesTransform$: gridAxesTransform$,
+    gridGraphicTransform$: gridGraphicTransform$,
+  })
+
 
   return {
     fullParams$: observer.fullParams$,
@@ -138,10 +157,6 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     textSizePx$,
     isSeriesSeprate$,
     gridContainerPosition$,
-    gridAxesTransform$,
-    gridAxesReverseTransform$,
-    gridGraphicTransform$,
-    gridGraphicReverseScale$,
     gridAxesSize$,
     gridHighlight$,
     seriesLabels$,
@@ -151,5 +166,11 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     visibleComputedData$,
     visibleComputedLayoutData$,
     computedStackedData$,
+    groupScaleDomainValue$,
+    filteredMinMaxValue$,
+    gridAxesTransform$,
+    gridAxesReverseTransform$,
+    gridGraphicTransform$,
+    gridGraphicReverseScale$,
   }
 }