@orbcharts/plugins-basic 3.0.0-alpha.44 → 3.0.0-alpha.45

package/src/grid/plugins/Bars.ts

@@ -1,37 +1,51 @@
-import {
-  Subject,
-  Observable } from 'rxjs'
-import {
-  defineGridPlugin } from '@orbcharts/core'
-import { DEFAULT_BARS_PARAMS } from '../defaults'
-import { createBaseBars } from '../../base/BaseBars'
-
-const pluginName = 'Bars'
-
-export const Bars = defineGridPlugin(pluginName, DEFAULT_BARS_PARAMS)(({ selection, name, subject, observer }) => {
-  const destroy$ = new Subject()
-
-  const unsubscribeBaseBars = createBaseBars(pluginName, {
-    selection,
-    computedData$: observer.computedData$,
-    visibleComputedData$: observer.visibleComputedData$,
-    existSeriesLabels$: observer.existSeriesLabels$,
-    SeriesDataMap$: observer.SeriesDataMap$,
-    GroupDataMap$: observer.GroupDataMap$,
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    gridAxesTransform$: observer.gridAxesTransform$,
-    gridGraphicTransform$: observer.gridGraphicTransform$,
-    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
-    gridAxesSize$: observer.gridAxesSize$,
-    gridHighlight$: observer.gridHighlight$,
-    gridContainer$: observer.gridContainer$,
-    isSeriesPositionSeprate$: observer.isSeriesPositionSeprate$,
-    event$: subject.event$,
-  })
-
-  return () => {
-    destroy$.next(undefined)
-    unsubscribeBaseBars()
-  }
-})
+import {
+  Subject,
+  Observable,
+  map,
+  distinctUntilChanged,
+  shareReplay,
+  takeUntil
+} from 'rxjs'
+import {
+  defineGridPlugin } from '@orbcharts/core'
+import { DEFAULT_BARS_PARAMS } from '../defaults'
+import { createBaseBars } from '../../base/BaseBars'
+
+const pluginName = 'Bars'
+
+export const Bars = defineGridPlugin(pluginName, DEFAULT_BARS_PARAMS)(({ selection, name, subject, observer }) => {
+  const destroy$ = new Subject()
+
+  const isSeriesSeprate$ = observer.fullDataFormatter$.pipe(
+    takeUntil(destroy$),
+    map(d => d.grid.separateSeries),
+    distinctUntilChanged(),
+    shareReplay(1)
+  )
+
+  const unsubscribeBaseBars = createBaseBars(pluginName, {
+    selection,
+    computedData$: observer.computedData$,
+    computedLayoutData$: observer.computedLayoutData$,
+    visibleComputedData$: observer.visibleComputedData$,
+    visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
+    seriesLabels$: observer.seriesLabels$,
+    SeriesDataMap$: observer.SeriesDataMap$,
+    GroupDataMap$: observer.GroupDataMap$,
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    gridAxesTransform$: observer.gridAxesTransform$,
+    gridGraphicTransform$: observer.gridGraphicTransform$,
+    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
+    gridAxesSize$: observer.gridAxesSize$,
+    gridHighlight$: observer.gridHighlight$,
+    gridContainerPosition$: observer.gridContainerPosition$,
+    isSeriesSeprate$: isSeriesSeprate$,
+    event$: subject.event$,
+  })
+
+  return () => {
+    destroy$.next(undefined)
+    unsubscribeBaseBars()
+  }
+})

package/src/grid/plugins/BarsDiverging.ts

@@ -1,39 +1,41 @@
-import {
-  of,
-  Subject,
-  Observable } from 'rxjs'
-import {
-  defineGridPlugin } from '@orbcharts/core'
-import { DEFAULT_BARS_PARAMS } from '../defaults'
-import { createBaseBars } from '../../base/BaseBars'
-
-const pluginName = 'BarsDiverging'
-
-export const BarsDiverging = defineGridPlugin(pluginName, DEFAULT_BARS_PARAMS)(({ selection, name, subject, observer }) => {
-  const destroy$ = new Subject()
-
-  const unsubscribeBaseBars = createBaseBars(pluginName, {
-    selection,
-    computedData$: observer.computedData$,
-    visibleComputedData$: observer.visibleComputedData$,
-    existSeriesLabels$: observer.existSeriesLabels$,
-    SeriesDataMap$: observer.SeriesDataMap$,
-    GroupDataMap$: observer.GroupDataMap$,
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    gridAxesTransform$: observer.gridAxesTransform$,
-    gridGraphicTransform$: observer.gridGraphicTransform$,
-    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
-    gridAxesSize$: observer.gridAxesSize$,
-    gridHighlight$: observer.gridHighlight$,
-    gridContainer$: observer.gridContainer$,
-    // isSeriesPositionSeprate$: observer.isSeriesPositionSeprate$,
-    isSeriesPositionSeprate$: of(true), // hack: 永遠為true，可以強制讓每組series的bars的x位置都是一樣的
-    event$: subject.event$,
-  })
-
-  return () => {
-    destroy$.next(undefined)
-    unsubscribeBaseBars()
-  }
-})
+import {
+  of,
+  Subject,
+  Observable } from 'rxjs'
+import {
+  defineGridPlugin } from '@orbcharts/core'
+import { DEFAULT_BARS_PARAMS } from '../defaults'
+import { createBaseBars } from '../../base/BaseBars'
+
+const pluginName = 'BarsDiverging'
+
+export const BarsDiverging = defineGridPlugin(pluginName, DEFAULT_BARS_PARAMS)(({ selection, name, subject, observer }) => {
+  const destroy$ = new Subject()
+
+  const unsubscribeBaseBars = createBaseBars(pluginName, {
+    selection,
+    computedData$: observer.computedData$,
+    computedLayoutData$: observer.computedLayoutData$,
+    visibleComputedData$: observer.visibleComputedData$,
+    visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
+    seriesLabels$: observer.seriesLabels$,
+    SeriesDataMap$: observer.SeriesDataMap$,
+    GroupDataMap$: observer.GroupDataMap$,
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    gridAxesTransform$: observer.gridAxesTransform$,
+    gridGraphicTransform$: observer.gridGraphicTransform$,
+    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
+    gridAxesSize$: observer.gridAxesSize$,
+    gridHighlight$: observer.gridHighlight$,
+    gridContainerPosition$: observer.gridContainerPosition$,
+    // isSeriesSeprate$: observer.isSeriesSeprate$,
+    isSeriesSeprate$: of(true), // hack: 永遠為true，可以強制讓每組series的bars的x位置都是一樣的
+    event$: subject.event$,
+  })
+
+  return () => {
+    destroy$.next(undefined)
+    unsubscribeBaseBars()
+  }
+})

package/src/grid/plugins/BarsTriangle.ts

@@ -1,35 +1,51 @@
-import {
-  Subject,
-  Observable } from 'rxjs'
-import { defineGridPlugin } from '@orbcharts/core'
-import { DEFAULT_BARS_TRIANGLE_PARAMS } from '../defaults'
-import { createBaseBarsTriangle } from '../../base/BaseBarsTriangle'
-
-const pluginName = 'BarsTriangle'
-
-export const BarsTriangle = defineGridPlugin(pluginName, DEFAULT_BARS_TRIANGLE_PARAMS)(({ selection, name, subject, observer }) => {
-  const destroy$ = new Subject()
-
-  const unsubscribeBaseBars = createBaseBarsTriangle(pluginName, {
-    selection,
-    computedData$: observer.computedData$,
-    visibleComputedData$: observer.visibleComputedData$,
-    existSeriesLabels$: observer.existSeriesLabels$,
-    SeriesDataMap$: observer.SeriesDataMap$,
-    GroupDataMap$: observer.GroupDataMap$,
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    gridAxesTransform$: observer.gridAxesTransform$,
-    gridGraphicTransform$: observer.gridGraphicTransform$,
-    gridAxesSize$: observer.gridAxesSize$,
-    gridHighlight$: observer.gridHighlight$,
-    gridContainer$: observer.gridContainer$,
-    isSeriesPositionSeprate$: observer.isSeriesPositionSeprate$,
-    event$: subject.event$,
-  })
-
-  return () => {
-    destroy$.next(undefined)
-    unsubscribeBaseBars()
-  }
+import {
+  Subject,
+  Observable,
+  takeUntil,
+  map,
+  distinctUntilChanged,
+  shareReplay
+} from 'rxjs'
+import { defineGridPlugin } from '@orbcharts/core'
+import { DEFAULT_BARS_TRIANGLE_PARAMS } from '../defaults'
+import { createBaseBarsTriangle } from '../../base/BaseBarsTriangle'
+
+const pluginName = 'BarsTriangle'
+
+export const BarsTriangle = defineGridPlugin(pluginName, DEFAULT_BARS_TRIANGLE_PARAMS)(({ selection, name, subject, observer }) => {
+  const destroy$ = new Subject()
+
+
+  const isSeriesSeprate$ = observer.fullDataFormatter$.pipe(
+    takeUntil(destroy$),
+    map(d => d.grid.separateSeries),
+    distinctUntilChanged(),
+    shareReplay(1)
+  )
+
+  const unsubscribeBaseBars = createBaseBarsTriangle(pluginName, {
+    selection,
+    computedData$: observer.computedData$,
+    computedLayoutData$: observer.computedLayoutData$,
+    visibleComputedData$: observer.visibleComputedData$,
+    visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    seriesLabels$: observer.seriesLabels$,
+    SeriesDataMap$: observer.SeriesDataMap$,
+    GroupDataMap$: observer.GroupDataMap$,
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    gridAxesTransform$: observer.gridAxesTransform$,
+    gridGraphicTransform$: observer.gridGraphicTransform$,
+    gridAxesSize$: observer.gridAxesSize$,
+    gridHighlight$: observer.gridHighlight$,
+    gridContainerPosition$: observer.gridContainerPosition$,
+    isSeriesSeprate$,
+    event$: subject.event$,
+  })
+
+  return () => {
+    destroy$.next(undefined)
+    unsubscribeBaseBars()
+  }
 })

package/src/grid/plugins/Dots.ts

@@ -1,36 +1,38 @@
-import {
-  Subject } from 'rxjs'
-import {
-  defineGridPlugin } from '@orbcharts/core'
-import { DEFAULT_DOTS_PARAMS } from '../defaults'
-import { createBaseDots } from '../../base/BaseDots'
-
-const pluginName = 'Dots'
-
-export const Dots = defineGridPlugin(pluginName, DEFAULT_DOTS_PARAMS)(({ selection, name, subject, observer }) => {
-  
-  const destroy$ = new Subject()
-
-  const unsubscribeBaseBars = createBaseDots(pluginName, {
-    selection,
-    computedData$: observer.computedData$,
-    visibleComputedData$: observer.visibleComputedData$,
-    existSeriesLabels$: observer.existSeriesLabels$,
-    SeriesDataMap$: observer.SeriesDataMap$,
-    GroupDataMap$: observer.GroupDataMap$,
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    gridAxesTransform$: observer.gridAxesTransform$,
-    gridGraphicTransform$: observer.gridGraphicTransform$,
-    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
-    gridAxesSize$: observer.gridAxesSize$,
-    gridHighlight$: observer.gridHighlight$,
-    gridContainer$: observer.gridContainer$,
-    event$: subject.event$,
-  })
-
-  return () => {
-    destroy$.next(undefined)
-    unsubscribeBaseBars()
-  }
+import {
+  Subject } from 'rxjs'
+import {
+  defineGridPlugin } from '@orbcharts/core'
+import { DEFAULT_DOTS_PARAMS } from '../defaults'
+import { createBaseDots } from '../../base/BaseDots'
+
+const pluginName = 'Dots'
+
+export const Dots = defineGridPlugin(pluginName, DEFAULT_DOTS_PARAMS)(({ selection, name, subject, observer }) => {
+  
+  const destroy$ = new Subject()
+
+  const unsubscribeBaseBars = createBaseDots(pluginName, {
+    selection,
+    computedData$: observer.computedData$,
+    computedLayoutData$: observer.computedLayoutData$,
+    visibleComputedData$: observer.visibleComputedData$,
+    visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
+    seriesLabels$: observer.seriesLabels$,
+    SeriesDataMap$: observer.SeriesDataMap$,
+    GroupDataMap$: observer.GroupDataMap$,
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    gridAxesTransform$: observer.gridAxesTransform$,
+    gridGraphicTransform$: observer.gridGraphicTransform$,
+    gridGraphicReverseScale$: observer.gridGraphicReverseScale$,
+    gridAxesSize$: observer.gridAxesSize$,
+    gridHighlight$: observer.gridHighlight$,
+    gridContainerPosition$: observer.gridContainerPosition$,
+    event$: subject.event$,
+  })
+
+  return () => {
+    destroy$.next(undefined)
+    unsubscribeBaseBars()
+  }
 })

package/src/grid/plugins/GridLegend.ts

@@ -1,59 +1,59 @@
-import * as d3 from 'd3'
-import {
-  combineLatest,
-  map,
-  switchMap,
-  takeUntil,
-  Observable,
-  Subject } from 'rxjs'
-import {
-  defineGridPlugin } from '@orbcharts/core'
-import { DEFAULT_GRID_LEGEND_PARAMS } from '../defaults'
-import { createBaseLegend } from '../../base/BaseLegend'
-
-const pluginName = 'GridLegend'
-
-export const GridLegend = defineGridPlugin(pluginName, DEFAULT_GRID_LEGEND_PARAMS)(({ selection, rootSelection, observer, subject }) => {
-  
-  const destroy$ = new Subject()
-
-  const seriesLabels$: Observable<string[]> = observer.SeriesDataMap$.pipe(
-    takeUntil(destroy$),
-    map(data => {
-      return Array.from(data.keys())
-    })
-  )
-
-  // 全部列點矩型使用相同樣式參數
-  const fullParams$ = observer.fullParams$.pipe(
-    takeUntil(destroy$),
-    map(d => {
-      const seriesList = [
-        {
-          listRectWidth: d.listRectWidth,
-          listRectHeight: d.listRectHeight,
-          listRectRadius: d.listRectRadius,
-        }
-      ]
-      return {
-        ...d,
-        seriesList
-      }
-    })
-  )
-
-  const unsubscribeBaseLegend = createBaseLegend(pluginName, {
-    rootSelection,
-    seriesLabels$,
-    fullParams$,
-    layout$: observer.layout$,
-    fullChartParams$: observer.fullChartParams$,
-    textSizePx$: observer.textSizePx$
-  })
-
-  return () => {
-    destroy$.next(undefined)
-    unsubscribeBaseLegend()
-  }
-})
-
+import * as d3 from 'd3'
+import {
+  combineLatest,
+  map,
+  switchMap,
+  takeUntil,
+  Observable,
+  Subject } from 'rxjs'
+import {
+  defineGridPlugin } from '@orbcharts/core'
+import { DEFAULT_GRID_LEGEND_PARAMS } from '../defaults'
+import { createBaseLegend } from '../../base/BaseLegend'
+
+const pluginName = 'GridLegend'
+
+export const GridLegend = defineGridPlugin(pluginName, DEFAULT_GRID_LEGEND_PARAMS)(({ selection, rootSelection, observer, subject }) => {
+  
+  const destroy$ = new Subject()
+
+  const seriesLabels$: Observable<string[]> = observer.SeriesDataMap$.pipe(
+    takeUntil(destroy$),
+    map(data => {
+      return Array.from(data.keys())
+    })
+  )
+
+  // 全部列點矩型使用相同樣式參數
+  const fullParams$ = observer.fullParams$.pipe(
+    takeUntil(destroy$),
+    map(d => {
+      const seriesList = [
+        {
+          listRectWidth: d.listRectWidth,
+          listRectHeight: d.listRectHeight,
+          listRectRadius: d.listRectRadius,
+        }
+      ]
+      return {
+        ...d,
+        seriesList
+      }
+    })
+  )
+
+  const unsubscribeBaseLegend = createBaseLegend(pluginName, {
+    rootSelection,
+    seriesLabels$,
+    fullParams$,
+    layout$: observer.layout$,
+    fullChartParams$: observer.fullChartParams$,
+    textSizePx$: observer.textSizePx$
+  })
+
+  return () => {
+    destroy$.next(undefined)
+    unsubscribeBaseLegend()
+  }
+})
+