@orbcharts/core 3.0.6 → 4.0.0-alpha.0

package/src/multiGrid/multiGridObservables.ts

@@ -1,367 +0,0 @@
-import {
-  combineLatest,
-  distinctUntilChanged,
-  filter,
-  of,
-  map,
-  merge,
-  takeUntil,
-  shareReplay,
-  switchMap,
-  Subject,
-  Observable, 
-  combineLatestAll} from 'rxjs'
-import type {
-  AxisPosition,
-  ChartType,
-  ChartParams,
-  ComputedDataTypeMap,
-  ComputedDataGrid,
-  ContextObserverMultiGridDetail,
-  ContainerSize,
-  DataTypeMap,
-  DataFormatterTypeMap,
-  DataFormatterGrid,
-  DataFormatterMultiGridContainer,
-  EventMultiGrid,
-  ContainerPositionScaled,
-  HighlightTarget,
-  Layout,
-  TransformData } from '../../lib/core-types'
-import {
-  highlightObservable,
-  seriesDataMapObservable,
-  groupDataMapObservable } from '../utils/observables'
-import {
-  gridComputedAxesDataObservable,
-  gridAxesSizeObservable,
-  gridAxesContainerSizeObservable,
-  gridSeriesLabelsObservable,
-  gridVisibleComputedDataObservable,
-  gridVisibleComputedAxesDataObservable,
-  // isSeriesSeprateObservable,
-  gridContainerPositionObservable,
-  computedStackedDataObservables,
-  groupScaleDomainValueObservable,
-  filteredMinMaxValueObservable,
-  gridAxesTransformObservable,
-  gridAxesReverseTransformObservable,
-  gridGraphicTransformObservable,
-  gridGraphicReverseScaleObservable,
-} from '../grid/gridObservables'
-import { DEFAULT_DATA_FORMATTER_MULTI_GRID_GRID } from '../defaults'
-import { calcContainerPositionScaled } from '../utils/orbchartsUtils'
-
-// 每一個grid計算出來的所有Observable
-export const multiGridEachDetailObservable = ({ fullDataFormatter$, computedData$, layout$, fullChartParams$, event$, containerSize$ }: {
-  fullDataFormatter$: Observable<DataFormatterTypeMap<'multiGrid'>>
-  computedData$: Observable<ComputedDataTypeMap<'multiGrid'>>
-  layout$: Observable<Layout>
-  fullChartParams$: Observable<ChartParams>
-  event$: Subject<EventMultiGrid>
-  containerSize$: Observable<ContainerSize>
-}): Observable<ContextObserverMultiGridDetail[]> => {
-
-  const destroy$ = new Subject()
-
-  // // highlight全部grid
-  // const allGridHighlight$ = highlightObservable({
-  //   datumList$: computedData$.pipe(
-  //     map(d => d.flat().flat()),
-  //     shareReplay(1)
-  //   ),
-  //   fullChartParams$: fullChartParams$,
-  //   event$: event$
-  // }).pipe(
-  //   shareReplay(1)
-  // )
-
-  const multiGridContainer$ = multiGridContainerObservable({
-    computedData$: computedData$,
-    fullDataFormatter$: fullDataFormatter$,
-    layout$: layout$,
-  }).pipe(
-    shareReplay(1)
-  )
-
-  return combineLatest({
-    fullDataFormatter: fullDataFormatter$,
-    computedData: computedData$,
-    multiGridContainer: multiGridContainer$
-  }).pipe(
-    switchMap(async (d) => d),
-    // distinctUntilChanged((a, b) => {
-    //   // 只有當computedData的長度改變時，才重新計算
-    //   return a.computedData.length === b.computedData.length
-    // }),
-    map(data => {
-      // 每次重新計算時，清除之前的訂閱
-      destroy$.next(undefined)
-
-      const defaultGrid = data.fullDataFormatter.gridList[0] ?? DEFAULT_DATA_FORMATTER_MULTI_GRID_GRID
-
-      return data.computedData.map((gridComputedData, gridIndex) => {
-
-        // -- 取得該grid的data和dataFormatter
-        const grid = data.fullDataFormatter.gridList[gridIndex] ?? defaultGrid
-        const gridDataFormatter: DataFormatterGrid = {
-          type: 'grid',
-          visibleFilter: data.fullDataFormatter.visibleFilter as any,
-          // grid: {
-            ...grid,
-          // },
-          container: {
-            ...data.fullDataFormatter.container
-          }
-        }
-        const gridDataFormatter$ = of(gridDataFormatter).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-        const gridComputedData$ = of(gridComputedData).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        // const isSeriesSeprate$ = isSeriesSeprateObservable({
-        //   computedData$: gridComputedData$,
-        //   fullDataFormatter$: gridDataFormatter$,
-        // }).pipe(
-        //   takeUntil(destroy$),
-        //   shareReplay(1)
-        // )
-      
-        // const gridContainerPosition$ = gridContainerPositionObservable({
-        //   computedData$: gridComputedData$,
-        //   fullDataFormatter$: gridDataFormatter$,
-        //   layout$
-        // }).pipe(
-        //   shareReplay(1)
-        // )
-
-        const isSeriesSeprate$ = gridDataFormatter$.pipe(
-          map(d => d.separateSeries),
-          distinctUntilChanged(),
-          shareReplay(1)
-        )
-
-        const gridContainerPosition$ = of(data.multiGridContainer[gridIndex]).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const gridAxesSize$ = gridAxesSizeObservable({
-          fullDataFormatter$: gridDataFormatter$,
-          layout$: layout$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-        
-        const gridAxesContainerSize$ = gridAxesContainerSizeObservable({
-          fullDataFormatter$: gridDataFormatter$,
-          containerSize$: containerSize$
-        }).pipe(
-          shareReplay(1)
-        )
-    
-        const datumList$ = gridComputedData$.pipe(
-          map(d => d.flat())
-        ).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        // const gridHighlight$ = highlightObservable({
-        //   datumList$,
-        //   fullChartParams$: fullChartParams$,
-        //   event$: event$
-        // }).pipe(
-        //   shareReplay(1)
-        // )
-    
-        const seriesLabels$ = gridSeriesLabelsObservable({
-          computedData$: gridComputedData$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        const SeriesDataMap$ = seriesDataMapObservable({
-          datumList$: datumList$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        const GroupDataMap$ = groupDataMapObservable({
-          datumList$: datumList$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        const visibleComputedData$ = gridVisibleComputedDataObservable({
-          computedData$: gridComputedData$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const computedAxesData$ = gridComputedAxesDataObservable({
-          computedData$: gridComputedData$,
-          fullDataFormatter$: gridDataFormatter$,
-          layout$: layout$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        const visibleComputedAxesData$ = gridVisibleComputedAxesDataObservable({
-          computedAxesData$: computedAxesData$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const computedStackedData$ = computedStackedDataObservables({
-          computedData$: gridComputedData$,
-          isSeriesSeprate$: isSeriesSeprate$
-        }).pipe(
-          shareReplay(1)
-        )
-
-        const groupScaleDomainValue$ = groupScaleDomainValueObservable({
-          computedData$: gridComputedData$,
-          fullDataFormatter$: gridDataFormatter$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const filteredMinMaxValue$ = filteredMinMaxValueObservable({
-          computedData$: gridComputedData$,
-          groupScaleDomainValue$: groupScaleDomainValue$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const filteredStackedMinMaxValue$ = filteredMinMaxValueObservable({
-          computedData$: computedStackedData$,
-          groupScaleDomainValue$: groupScaleDomainValue$,
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-
-        const gridAxesTransform$ = gridAxesTransformObservable({
-          fullDataFormatter$: gridDataFormatter$,
-          layout$: layout$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        
-        const gridAxesReverseTransform$ = gridAxesReverseTransformObservable({
-          gridAxesTransform$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-        
-        const gridGraphicTransform$ = gridGraphicTransformObservable({
-          computedData$: gridComputedData$,
-          groupScaleDomainValue$: groupScaleDomainValue$,
-          filteredMinMaxValue$: filteredMinMaxValue$,
-          fullDataFormatter$: gridDataFormatter$,
-          layout$: layout$
-        }).pipe(
-          takeUntil(destroy$),
-          shareReplay(1)
-        )
-    
-        const gridGraphicReverseScale$ = gridGraphicReverseScaleObservable({
-          gridContainerPosition$: gridContainerPosition$,
-          gridAxesTransform$: gridAxesTransform$,
-          gridGraphicTransform$: gridGraphicTransform$,
-        })
-
-        return {
-          isSeriesSeprate$,
-          gridContainerPosition$,
-          gridAxesSize$,
-          gridAxesContainerSize$,
-          // gridHighlight$: allGridHighlight$,
-          seriesLabels$,
-          SeriesDataMap$,
-          GroupDataMap$,
-          dataFormatter$: gridDataFormatter$,
-          computedData$: gridComputedData$,
-          computedAxesData$,
-          visibleComputedData$,
-          visibleComputedAxesData$,
-          computedStackedData$,
-          groupScaleDomainValue$,
-          filteredMinMaxValue$,
-          filteredStackedMinMaxValue$,
-          gridAxesTransform$,
-          gridAxesReverseTransform$,
-          gridGraphicTransform$,
-          gridGraphicReverseScale$,
-        }
-      })
-    })
-  )
-}
-
-
-// 所有container位置（對應series）
-export const multiGridContainerObservable = ({ computedData$, fullDataFormatter$, layout$ }: {
-  computedData$: Observable<ComputedDataTypeMap<'multiGrid'>>
-  fullDataFormatter$: Observable<DataFormatterTypeMap<'multiGrid'>>
-  layout$: Observable<Layout>
-}): Observable<ContainerPositionScaled[][]> => {
-
-  return combineLatest({
-    computedData: computedData$,
-    fullDataFormatter: fullDataFormatter$,
-    layout: layout$,
-  }).pipe(
-    switchMap(async (d) => d),
-    map(data => {
-
-      const defaultGrid = data.fullDataFormatter.gridList[0] ?? DEFAULT_DATA_FORMATTER_MULTI_GRID_GRID
-      const slotAmount = data.computedData.reduce((acc, gridData, gridIndex) => {
-        const grid = data.fullDataFormatter.gridList[gridIndex] ?? defaultGrid
-        const gridSlotAmount = grid.separateSeries
-          ? gridData.length
-          : data.fullDataFormatter.separateGrid
-            ? 1
-            : 0 // 如果grid和series都不分開，則slotAmount不增加（在相同的slot）
-        return acc + gridSlotAmount
-      }, 0) || 1
-
-      const gridContainerLayout = calcContainerPositionScaled(data.layout, data.fullDataFormatter.container, slotAmount)
-
-      let accGridSlotIndex = 0
-      const gridContainerPositionArr = data.computedData.map((gridData, gridIndex) => {
-        const grid = data.fullDataFormatter.gridList[gridIndex] ?? defaultGrid
-        const seriesContainerArr = gridData.map((seriesData, seriesIndex) => {
-          const container = gridContainerLayout[accGridSlotIndex]
-          if (grid.separateSeries) {
-            accGridSlotIndex += 1
-          }
-          return container
-        })
-        if (!grid.separateSeries && data.fullDataFormatter.separateGrid) {
-          accGridSlotIndex += 1
-        }
-        return seriesContainerArr
-      })
-
-      return gridContainerPositionArr
-    }),
-  )
-}

package/src/multiValue/computedDataFn.ts

@@ -1,113 +0,0 @@
-import type { DataMultiValueDatum, ComputedDataFn, ComputedDatumMultiValue } from '../../lib/core-types'
-import { createDefaultCategoryLabel, createDefaultDatumId, seriesColorPredicate } from '../utils/orbchartsUtils'
-import { isPlainObject } from '../utils'
-
-export const computedDataFn: ComputedDataFn<'multiValue'> = (context) => {
-  const { data, dataFormatter, chartParams } = context
-  if (!data.length) {
-    return []
-  }
-
-  const defaultCategoryLabel = createDefaultCategoryLabel()
-
-  let computedDataMultiValue: ComputedDatumMultiValue[][] = []
-
-  try {
-    const dataMultiValue: DataMultiValueDatum[] = data.map((d, i) => {
-      if (Array.isArray(d)) {
-        return {
-          id: '',
-          label: '',
-          description: '',
-          // tooltipContent: '',
-          data: {},
-          categoryLabel: defaultCategoryLabel,
-          value: d
-        }
-      } else if (isPlainObject(d)) {
-        return {
-          id: d.id ?? '',
-          label: d.label ?? '',
-          description: d.description ?? '',
-          // tooltipContent: _d.tooltipContent ?? '',
-          data: d.data ?? {},
-          categoryLabel: d.categoryLabel ?? defaultCategoryLabel,
-          value: d.value
-        }
-      } else {
-        return {
-          id: '',
-          label: '',
-          description: '',
-          // tooltipContent: '',
-          data: {},
-          categoryLabel: defaultCategoryLabel,
-          value: []
-        }
-      }
-    })
-
-    const categoryLabels = (() => {
-      // 先使用 dataFormatter.categoryLabels
-      const CategoryLabelsSet = new Set(dataFormatter.categoryLabels)
-      // 再加入 datum 中的 categoryLabel
-      for (let datum of dataMultiValue) {
-        const categoryLabel = datum.categoryLabel ?? defaultCategoryLabel
-        CategoryLabelsSet.add(categoryLabel) // 不重覆
-      }
-      return Array.from(CategoryLabelsSet)
-    })()
-    
-    // <categoryLabel, categoryIndex>
-    const CategoryIndexMap = new Map<string, number>(
-      categoryLabels.map((label, index) => [label, index])
-    )
-
-  
-    // let index = 0
-  
-    dataMultiValue.forEach((d, i) => {
-      // const currentIndex = index
-      // index++
-
-      const defaultId = createDefaultDatumId(dataFormatter.type, i)
-
-      const categoryIndex = CategoryIndexMap.get(d.categoryLabel) ?? 0
-
-      const color = seriesColorPredicate(categoryIndex, chartParams)
-
-      const computedDatum: ComputedDatumMultiValue = {
-        id: d.id ? d.id : defaultId,
-        index: i,
-        label: d.label ? d.label : defaultId,
-        description: d.description ?? '',
-        // tooltipContent: _d.tooltipContent ? _d.tooltipContent : dataFormatter.tooltipContentFormat(_d, i, _i, context),
-        data: d.data,
-        // datumIndex: i,
-        value: d.value,
-        categoryIndex,
-        categoryLabel: d.categoryLabel,
-        xValueIndex: dataFormatter.xAxis.valueIndex,
-        yValueIndex: dataFormatter.yAxis.valueIndex,
-        // valueLabel: formatValueToLabel(_d.value, dataFormatter.multiValue[_i].valueFormat),
-        // axis: _i == 0 ? xScale(_d.value) : yScale(_d.value),
-        visible: true, // 先給預設值
-        color,
-        // _visibleValue: d.value // 預設和value相同
-      }
-
-      computedDatum.visible = dataFormatter.visibleFilter(computedDatum, context)
-
-      // 依 categoryIndex 分組
-      if (!computedDataMultiValue[categoryIndex]) {
-        computedDataMultiValue[categoryIndex] = []
-      }
-      computedDataMultiValue[categoryIndex].push(computedDatum)
-    })
-  } catch (e) {
-    // console.error(e)
-    throw Error(e)
-  }
-
-  return computedDataMultiValue
-}