@orbcharts/core 3.0.5 → 3.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orbcharts/core",
-  "version": "3.0.5",
+  "version": "3.0.7",
   "description": "Core codes for OrbCharts",
   "author": "Blue Planet Inc.",
   "license": "Apache-2.0",
@@ -39,7 +39,7 @@
     "vite-plugin-dts": "^3.7.3"
   },
   "dependencies": {
-    "@orbcharts/core-types": "^3.0.3",
+    "@orbcharts/core-types": "^3.0.5",
     "d3": "^7.8.5",
     "rxjs": "^7.8.1"
   }

package/src/grid/contextObserverCallback.ts

@@ -139,6 +139,13 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     shareReplay(1)
   )
 
+  const filteredStackedMinMaxValue$ = filteredMinMaxValueObservable({
+    computedData$: computedStackedData$,
+    groupScaleDomainValue$: groupScaleDomainValue$,
+  }).pipe(
+    shareReplay(1)
+  )
+
   const gridAxesTransform$ = gridAxesTransformObservable({
     fullDataFormatter$: observer.fullDataFormatter$,
     layout$: observer.layout$
@@ -193,6 +200,7 @@ export const contextObserverCallback: ContextObserverCallback<'grid'> = ({ subje
     computedStackedData$,
     groupScaleDomainValue$,
     filteredMinMaxValue$,
+    filteredStackedMinMaxValue$,
     gridAxesTransform$,
     gridAxesReverseTransform$,
     gridGraphicTransform$,

package/src/grid/gridObservables.ts

@@ -586,9 +586,11 @@ export const gridGraphicTransformObservable = ({ computedData$, groupScaleDomain
     // })
   
     // const filteredMinMax = getMinMaxGrid(filteredData)
-    if (filteredMinMaxValue[0] === filteredMinMaxValue[1] && filteredMinMaxValue[1] === 0) {
+    const filteredMin = filteredMinMaxValue[0]
+    let filteredMax = filteredMinMaxValue[1]
+    if (filteredMin === filteredMax && filteredMax === 0) {
       // filteredMinMaxValue[0] = filteredMinMaxValue[1] - 1 // 避免最大及最小值相同造成無法計算scale
-      filteredMinMaxValue[1] = 1 // 避免最大及最小值同等於 0 造成無法計算scale
+      filteredMax = 1 // 避免最大及最小值同等於 0 造成無法計算scale
     }
   
     const valueAxisWidth = (valueAxis.position === 'left' || valueAxis.position === 'right')
@@ -596,8 +598,8 @@ export const gridGraphicTransformObservable = ({ computedData$, groupScaleDomain
       : width
   
     const valueScale: d3.ScaleLinear<number, number> = createValueToAxisScale({
-      maxValue: filteredMinMaxValue[1],
-      minValue: filteredMinMaxValue[0],
+      maxValue: filteredMax,
+      minValue: filteredMin,
       axisWidth: valueAxisWidth,
       scaleDomain: valueAxis.scaleDomain,
       scaleRange: valueAxis.scaleRange
@@ -611,9 +613,11 @@ export const gridGraphicTransformObservable = ({ computedData$, groupScaleDomain
   // })
     // -- translateY, scaleY --
     const minMax = getMinMaxGrid(data)
-    if (minMax[0] === minMax[1] && minMax[1] === 0) {
+    const min = minMax[0]
+    let max = minMax[1]
+    if (min === max && max === 0) {
       // minMax[0] = minMax[1] - 1 // 避免最大及最小值相同造成無法計算scale
-      minMax[1] = 1 // 避免最大及最小值同等於 0 造成無法計算scale
+      max = 1 // 避免最大及最小值同等於 0 造成無法計算scale
     }
     // const rangeMinY = valueScale(minMax[0])
     const rangeMinY = valueScale(minMax[0] > 0 ? 0 : minMax[0]) // * 因為原本的座標就是以 0 到最大值或最小值範範圍計算的，所以這邊也是用同樣的方式計算

package/src/multiGrid/contextObserverCallback.ts

@@ -1,11 +1,15 @@
 import {
   map,
-  shareReplay } from 'rxjs'
+  switchMap,
+  merge,
+  forkJoin,
+  shareReplay,
+  Observable } from 'rxjs'
 import type { ContextObserverCallback, DataGridDatum } from '../../lib/core-types'
 import { multiGridEachDetailObservable, multiGridContainerObservable } from './multiGridObservables'
 import { textSizePxObservable, containerSizeObservable, highlightObservable } from '../utils/observables'
 // import { createMultiGridSeriesLabels } from '../utils/orbchartsUtils'
-import { combineLatest } from 'rxjs/internal/observable/combineLatest'
+import { filteredMinMaxValueObservable } from '../grid/gridObservables'
 
 export const contextObserverCallback: ContextObserverCallback<'multiGrid'> = ({ subject, observer }) => {
 
@@ -59,6 +63,34 @@ export const contextObserverCallback: ContextObserverCallback<'multiGrid'> = ({
   //   console.log('multiGridContainerPosition$', d)
   // })
 
+  const filteredMinMaxValue$: Observable<[number, number]> = multiGridEachDetail$.pipe(
+    switchMap(details => {
+      return forkJoin(details.map((detail, index) => {
+        return detail.filteredMinMaxValue$
+      }))
+    }),
+    map(filteredMinMaxValue => {
+      return [
+        Math.min(...filteredMinMaxValue.map(d => d[0])),
+        Math.max(...filteredMinMaxValue.map(d => d[1]))
+      ]
+    })
+  )
+
+  const filteredStackedMinMaxValue$: Observable<[number, number]> = multiGridEachDetail$.pipe(
+    switchMap(details => {
+      return forkJoin(details.map((detail, index) => {
+        return detail.filteredStackedMinMaxValue$
+      }))
+    }),
+    map(filteredMinMaxValue => {
+      return [
+        Math.min(...filteredMinMaxValue.map(d => d[0])),
+        Math.max(...filteredMinMaxValue.map(d => d[1]))
+      ]
+    })
+  )
+
   return {
     fullParams$: observer.fullParams$,
     fullChartParams$: observer.fullChartParams$,
@@ -69,6 +101,8 @@ export const contextObserverCallback: ContextObserverCallback<'multiGrid'> = ({
     containerSize$,
     multiGridHighlight$,
     multiGridContainerPosition$,
+    filteredMinMaxValue$,
+    filteredStackedMinMaxValue$,
     multiGridEachDetail$,
     // multiGridContainer$
   }

package/src/multiGrid/multiGridObservables.ts

@@ -247,6 +247,14 @@ export const multiGridEachDetailObservable = ({ fullDataFormatter$, computedData
           shareReplay(1)
         )
 
+        const filteredStackedMinMaxValue$ = filteredMinMaxValueObservable({
+          computedData$: computedStackedData$,
+          groupScaleDomainValue$: groupScaleDomainValue$,
+        }).pipe(
+          takeUntil(destroy$),
+          shareReplay(1)
+        )
+
         const gridAxesTransform$ = gridAxesTransformObservable({
           fullDataFormatter$: gridDataFormatter$,
           layout$: layout$
@@ -297,6 +305,7 @@ export const multiGridEachDetailObservable = ({ fullDataFormatter$, computedData
           computedStackedData$,
           groupScaleDomainValue$,
           filteredMinMaxValue$,
+          filteredStackedMinMaxValue$,
           gridAxesTransform$,
           gridAxesReverseTransform$,
           gridGraphicTransform$,

package/src/utils/observables.ts

@@ -53,7 +53,7 @@ interface HighlightTargetValue {
   seriesLabel: string | null
   groupLabel: string | null
   categoryLabel: string | null
-  highlightDefault: string | null
+  // highlightDefault: string | null
 }
 
 // 通用 highlight Observable
@@ -67,16 +67,16 @@ export const highlightObservable = <T extends ChartType, D>({ datumList$, fullCh
   // 預設的highlight
   const highlightDefault$: Observable<HighlightTargetValue> = fullChartParams$.pipe(
     takeUntil(destroy$),
-    map(d => d.highlightDefault),
+    map(d => d.highlightDefault || null),
     distinctUntilChanged(),
     map(highlightDefault => {
       return {
-        id: null,
-        label: null,
-        seriesLabel: null,
-        groupLabel: null,
-        categoryLabel: null,
-        highlightDefault
+        id: highlightDefault,
+        label: highlightDefault,
+        seriesLabel: highlightDefault,
+        groupLabel: highlightDefault,
+        categoryLabel: highlightDefault,
+        // highlightDefault
       } as HighlightTargetValue
     }),
     shareReplay(1)
@@ -106,7 +106,7 @@ export const highlightObservable = <T extends ChartType, D>({ datumList$, fullCh
               seriesLabel: highlightTarget === 'series' ? d.datum.seriesLabel : null,
               groupLabel: highlightTarget === 'group' ? d.datum.groupLabel : null,
               categoryLabel: highlightTarget === 'category' ? d.datum.categoryLabel : null,
-              highlightDefault: null
+              // highlightDefault: null
             } as HighlightTargetValue
             : {
               id: null,
@@ -114,7 +114,7 @@ export const highlightObservable = <T extends ChartType, D>({ datumList$, fullCh
               seriesLabel: null,
               groupLabel: null,
               categoryLabel: null,
-              highlightDefault: null
+              // highlightDefault: null
             } as HighlightTargetValue
         })
       )
@@ -178,7 +178,6 @@ export const highlightObservable = <T extends ChartType, D>({ datumList$, fullCh
       } else if (data.fullChartParams.highlightTarget === 'category') {
         datumList = getCategoryIds(data.datumList as ComputedDatumTypeMap<T>[], data.target.categoryLabel)
       }
-      
       subscriber.next(datumList as D[])
     })