@orbcharts/plugins-basic 3.0.0-beta.14 → 3.0.0-beta.16

package/src/multiValue/plugins/{XYZoom.ts → XZoom.ts}

@@ -17,7 +17,7 @@ import { DEFAULT_X_Y_ZOOM_PARAMS } from '../defaults'
 import { getClassName, getUniID } from '../../utils/orbchartsUtils'
 import { LAYER_INDEX_OF_ROOT } from '../../const'
 
-const pluginName = 'XYZoom'
+const pluginName = 'XZoom'
 const rectClassName = getClassName(pluginName, 'rect')
 
 const pluginConfig: DefinePluginConfig<typeof pluginName, typeof DEFAULT_X_Y_ZOOM_PARAMS> = {
@@ -33,7 +33,7 @@ const pluginConfig: DefinePluginConfig<typeof pluginName, typeof DEFAULT_X_Y_ZOO
   }
 }
 
-export const XYZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSelection, name, observer, subject }) => {
+export const XZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSelection, name, observer, subject }) => {
 
   const destroy$ = new Subject()
 
@@ -119,15 +119,15 @@ export const XYZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSel
     combineLatest({
       initXAxis: initXAxis$,
       layout: observer.layout$,
-      minMaxXY: observer.minMaxXY$
+      xyMinMax: observer.xyMinMax$
     }).pipe(
       takeUntil(destroy$),
       switchMap(async (d) => d),
     ).subscribe(data => {
     
       const xScale: d3.ScaleLinear<number, number> = createValueToAxisScale({
-        maxValue: data.minMaxXY.maxX,
-        minValue: data.minMaxXY.minX,
+        maxValue: data.xyMinMax.maxX,
+        minValue: data.xyMinMax.minX,
         axisWidth: data.layout.width,
         scaleDomain: data.initXAxis.scaleDomain,
         scaleRange: data.initXAxis.scaleRange,
@@ -141,15 +141,15 @@ export const XYZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSel
     combineLatest({
       initYAxis: initYAxis$,
       layout: observer.layout$,
-      minMaxXY: observer.minMaxXY$
+      xyMinMax: observer.xyMinMax$
     }).pipe(
       takeUntil(destroy$),
       switchMap(async (d) => d),
     ).subscribe(data => {
     
       const yScale: d3.ScaleLinear<number, number> = createValueToAxisScale({
-        maxValue: data.minMaxXY.maxY,
-        minValue: data.minMaxXY.minY,
+        maxValue: data.xyMinMax.maxY,
+        minValue: data.xyMinMax.minY,
         axisWidth: data.layout.height,
         scaleDomain: data.initYAxis.scaleDomain,
         scaleRange: data.initYAxis.scaleRange,
@@ -163,15 +163,15 @@ export const XYZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSel
   const minMaxScaleDomain$ = combineLatest({
     initXAxis: initXAxis$,
     initYAxis: initYAxis$,
-    minMaxXY: observer.minMaxXY$
+    xyMinMax: observer.xyMinMax$
   }).pipe(
     takeUntil(destroy$),
     switchMap(async (d) => d),
     map(data => {
-      let minX = data.minMaxXY.minX
-      let maxX = data.minMaxXY.maxX
-      let minY = data.minMaxXY.minY
-      let maxY = data.minMaxXY.maxY
+      let minX = data.xyMinMax.minX
+      let maxX = data.xyMinMax.maxX
+      let minY = data.xyMinMax.minY
+      let maxY = data.xyMinMax.maxY
 
       // 原始設定為auto時要額外判斷
       if (data.initXAxis.scaleDomain[0] === 'auto' && minX > 0) {
@@ -202,7 +202,7 @@ export const XYZoom = defineMultiValuePlugin(pluginConfig)(({ selection, rootSel
     // fullDataFormatter: fullDataFormatter$.pipe(first()), // 只用第一次資料來計算scale才不會造成每次變動都受到影響
     fullDataFormatter: observer.fullDataFormatter$,
     // groupMax: groupMax$,
-    // minMaxXY: observer.minMaxXY$,
+    // xyMinMax: observer.xyMinMax$,
     minMaxScaleDomain: minMaxScaleDomain$,
     // layout: observer.layout$,
     // axisSize: observer.gridAxesSize$

package/src/series/defaults.ts

@@ -29,17 +29,9 @@ export const DEFAULT_BUBBLES_PARAMS: BubblesParams = {
 }
 
 export const DEFAULT_PIE_PARAMS: PieParams = {
-  // padding: {
-  //   top: 50,
-  //   right: 70,
-  //   bottom: 50,
-  //   left: 70
-  // },
   outerRadius: 0.85,
   innerRadius: 0,
   outerRadiusWhileHighlight: 0.9,
-  // label?: LabelStyle
-  // enterDuration: 800,
   startAngle: 0,
   endAngle: Math.PI * 2,
   padAngle: 0,
@@ -47,9 +39,6 @@ export const DEFAULT_PIE_PARAMS: PieParams = {
   strokeWidth: 1,
   // padRadius: 100,
   cornerRadius: 0,
-  // highlightTarget: 'datum',
-  // highlightId: null,
-  // highlightLabel: null,
 }
 
 export const DEFAULT_PIE_EVENT_TEXTS_PARAMS: PieEventTextsParams = {
@@ -119,7 +108,7 @@ export const DEFAULT_PIE_LABELS_PARAMS: PieLabelsParams = {
 DEFAULT_PIE_LABELS_PARAMS.labelFn.toString = () => `d => String(d.label)`
 
 export const DEFAULT_ROSE_PARAMS: RoseParams = {
-  outerRadius: 0.85,
+  outerRadius: 0.95,
   padAngle: 0,
   strokeColorType: 'background',
   strokeWidth: 0.5,
@@ -129,7 +118,7 @@ export const DEFAULT_ROSE_PARAMS: RoseParams = {
 }
 
 export const DEFAULT_ROSE_LABELS_PARAMS: RoseLabelsParams = {
-  outerRadius: 0.85,
+  outerRadius: 0.95,
   labelCentroid: 2.1,
   labelFn: d => String(d.label),
   labelColorType: 'primary',

package/src/series/plugins/Bubbles.ts

@@ -5,6 +5,7 @@ import {
   switchMap,
   first,
   takeUntil,
+  debounceTime,
   Subject, 
   Observable,
   distinctUntilChanged,
@@ -95,9 +96,10 @@ const pluginConfig: DefinePluginConfig<typeof pluginName, typeof DEFAULT_BUBBLES
   }
 }
 
-let force: d3.Simulation<d3.SimulationNodeDatum, undefined> | undefined
 
-function makeForce (bubblesSelection: d3.Selection<SVGGElement, BubblesDatum, any, any>, fullParams: BubblesParams) {
+// let isRunning = false
+
+function createSimulation (bubblesSelection: d3.Selection<SVGGElement, BubblesDatum, any, any>, fullParams: BubblesParams) {
   return d3.forceSimulation()
     .velocityDecay(fullParams.force!.velocityDecay!)
     // .alphaDecay(0.2)
@@ -126,7 +128,12 @@ function makeForce (bubblesSelection: d3.Selection<SVGGElement, BubblesDatum, an
         })
         // .attr("cx", (d) => d.x)
         // .attr("cy", (d) => d.y)
+
+      
     })
+    // .on("end", () => {
+      
+    // })
 
 }
 
@@ -149,8 +156,8 @@ function makeForce (bubblesSelection: d3.Selection<SVGGElement, BubblesDatum, an
 //   return maxR * modifier
 // }
 
-function createBubblesData ({ visibleComputedLayoutData, LastBubbleDataMap, graphicWidth, graphicHeight, SeriesContainerPositionMap, scaleType }: {
-  visibleComputedLayoutData: ComputedDataSeries
+function createBubblesData ({ visibleComputedSortedData, LastBubbleDataMap, graphicWidth, graphicHeight, SeriesContainerPositionMap, scaleType }: {
+  visibleComputedSortedData: ComputedDataSeries
   LastBubbleDataMap: Map<string, BubblesDatum>
   graphicWidth: number
   graphicHeight: number
@@ -161,7 +168,7 @@ function createBubblesData ({ visibleComputedLayoutData, LastBubbleDataMap, grap
   // 虛擬大圓（所有小圓聚合起來的大圓）的半徑
   const totalR = Math.min(...[graphicWidth, graphicHeight]) / 2
 
-  const data = visibleComputedLayoutData.flat()
+  const data = visibleComputedSortedData.flat()
 
   const totalValue = data.reduce((acc, current) => acc + current.value, 0)
 
@@ -311,18 +318,18 @@ function setHighlightData ({ data, highlightRIncrease, highlightIds }: {
   })
 }
 
-function drag (): d3.DragBehavior<Element, unknown, unknown> {
+function drag (_simulation: d3.Simulation<d3.SimulationNodeDatum, undefined>): d3.DragBehavior<Element, unknown, unknown> {
   return d3.drag()
     .on("start", (event, d: any) => {
       if (!event.active) {
-        force!.alpha(1).restart()
+        _simulation!.alpha(1).restart()
       }
       d.fx = d.x
       d.fy = d.y
     })
     .on("drag", (event, d: any) => {
       if (!event.active) {
-        force!.alphaTarget(0)
+        _simulation!.alphaTarget(0)
       }
       d.fx = event.x
       d.fy = event.y
@@ -330,6 +337,7 @@ function drag (): d3.DragBehavior<Element, unknown, unknown> {
     .on("end", (event, d: any) => {
       d.fx = null
       d.fy = null
+      _simulation!.alpha(1).restart()
     })
 }
 
@@ -341,14 +349,15 @@ function drag (): d3.DragBehavior<Element, unknown, unknown> {
 //   return typeCenter ? typeCenter.x : 0
 // }
 
-function groupBubbles ({ fullParams, SeriesContainerPositionMap }: {
+function groupBubbles ({ _simulation, fullParams, SeriesContainerPositionMap }: {
+  _simulation: d3.Simulation<d3.SimulationNodeDatum, undefined>
   fullParams: BubblesParams
   // graphicWidth: number
   // graphicHeight: number
   SeriesContainerPositionMap: Map<string, ContainerPosition>
 }) {
   // console.log('groupBubbles')
-  force!
+  _simulation!
     // .force('x', d3.forceX().strength(fullParams.force.strength).x(graphicWidth / 2))
     // .force('y', d3.forceY().strength(fullParams.force.strength).y(graphicHeight / 2))
     .force('x', d3.forceX().strength(fullParams.force.strength).x((data: BubblesSimulationDatum) => {
@@ -358,7 +367,7 @@ function groupBubbles ({ fullParams, SeriesContainerPositionMap }: {
       return SeriesContainerPositionMap.get(data.seriesLabel)!.centerY
     }))
 
-  force!.alpha(1).restart()
+  // force!.alpha(1).restart()
 }
 
 function highlight ({ bubblesSelection, highlightIds, fullChartParams }: {
@@ -397,6 +406,8 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
   
   const destroy$ = new Subject()
 
+  let simulation: d3.Simulation<d3.SimulationNodeDatum, undefined> | undefined
+
   // 紀錄前一次bubble data
   let LastBubbleDataMap: Map<string, BubblesDatum> = new Map()
 
@@ -415,15 +426,15 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
   const bubblesData$ = combineLatest({
     layout: observer.layout$,
     SeriesContainerPositionMap: observer.SeriesContainerPositionMap$,
-    visibleComputedLayoutData: observer.visibleComputedLayoutData$,
+    visibleComputedSortedData: observer.visibleComputedSortedData$,
     scaleType: scaleType$
   }).pipe(
     takeUntil(destroy$),
     switchMap(async (d) => d),
     map(data => {
-      // console.log(data.visibleComputedLayoutData)
+      // console.log(data.visibleComputedSortedData)
       return createBubblesData({
-        visibleComputedLayoutData: data.visibleComputedLayoutData,
+        visibleComputedSortedData: data.visibleComputedSortedData,
         LastBubbleDataMap,
         graphicWidth: data.layout.width,
         graphicHeight: data.layout.height,
@@ -455,8 +466,9 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
     takeUntil(destroy$),
     switchMap(async (d) => d),
     map(data => {
-      if (force) {
-        force.stop()
+      if (simulation) {
+        // 先停止，重新計算之後再restart
+        simulation.stop()
       }
 
       const bubblesSelection = renderBubbles({
@@ -467,24 +479,23 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
         sumSeries: data.sumSeries
       })
       
-      force = makeForce(bubblesSelection, data.fullParams)
+      simulation = createSimulation(bubblesSelection, data.fullParams)
 
-      force.nodes(data.bubblesData)
+      simulation.nodes(data.bubblesData)
 
       groupBubbles({
+        _simulation: simulation,
         fullParams: data.fullParams,
         SeriesContainerPositionMap: data.SeriesContainerPositionMap
         // graphicWidth: data.layout.width,
         // graphicHeight: data.layout.height
       })
 
-      // setTimeout(() => {
-      //   force!.alphaTarget(0)
-      //   force!.alpha(1).restart()
-      // }, 2000)
+      simulation!.alpha(1).restart()
 
       return bubblesSelection
-    })
+    }),
+    shareReplay(1)
   )
   
   combineLatest({
@@ -568,22 +579,22 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
           data: data.computedData
         })
       })
-      .call(drag() as any)
+      .call(drag(simulation) as any)
 
     
   })
 
   combineLatest({
     bubblesSelection: bubblesSelection$,
-    bubblesData: bubblesData$,
+    // bubblesData: bubblesData$,
     highlight: observer.seriesHighlight$.pipe(
       map(data => data.map(d => d.id))
     ),
     fullChartParams: observer.fullChartParams$,
-    fullParams: observer.fullParams$,
-    sumSeries: sumSeries$,
-    // layout: observer.layout$,
-    SeriesContainerPositionMap: observer.SeriesContainerPositionMap$,
+    // fullParams: observer.fullParams$,
+    // sumSeries: sumSeries$,
+    // // layout: observer.layout$,
+    // SeriesContainerPositionMap: observer.SeriesContainerPositionMap$,
   }).pipe(
     takeUntil(destroy$),
     switchMap(async d => d)
@@ -614,8 +625,13 @@ export const Bubbles = defineSeriesPlugin(pluginConfig)(({ selection, name, obse
     // }
 
   })
+
   
   return () => {
     destroy$.next(undefined)
+    if (simulation) {
+      simulation.stop()
+      simulation = undefined
+    }
   }
 })

package/src/series/plugins/Pie.ts

@@ -205,7 +205,7 @@ function highlight ({ pathSelection, ids, fullChartParams, arc, arcHighlight }:
 function createEachPie (pluginName: string, context: {
   containerSelection: d3.Selection<SVGGElement, any, any, unknown>
   computedData$: Observable<ComputedDatumSeries[][]>
-  containerVisibleComputedLayoutData$: Observable<ComputedDatumSeries[]>
+  containerVisibleComputedSortedData$: Observable<ComputedDatumSeries[]>
   SeriesDataMap$: Observable<Map<string, ComputedDatumSeries[]>>
   fullParams$: Observable<PieParams>
   fullChartParams$: Observable<ChartParams>
@@ -248,7 +248,7 @@ function createEachPie (pluginName: string, context: {
 
   const pieData$: Observable<PieDatum[]> = new Observable(subscriber => {
     combineLatest({
-      containerVisibleComputedLayoutData: context.containerVisibleComputedLayoutData$,
+      containerVisibleComputedSortedData: context.containerVisibleComputedSortedData$,
       fullParams: context.fullParams$,
     }).pipe(
       takeUntil(destroy$),
@@ -256,7 +256,7 @@ function createEachPie (pluginName: string, context: {
     ).subscribe(data => {
       // console.log('pieData', data)
       const pieData: PieDatum[] = makePieData({
-        data: data.containerVisibleComputedLayoutData,
+        data: data.containerVisibleComputedSortedData,
         startAngle: data.fullParams.startAngle,
         endAngle: data.fullParams.endAngle
       })
@@ -592,7 +592,7 @@ export const Pie = defineSeriesPlugin(pluginConfig)(({ selection, name, subject,
         // console.log('containerIndex', containerIndex)
         const containerSelection = d3.select(g[containerIndex])
 
-        const containerVisibleComputedLayoutData$ = observer.visibleComputedLayoutData$.pipe(
+        const containerVisibleComputedSortedData$ = observer.visibleComputedSortedData$.pipe(
           takeUntil(destroy$),
           map(data => data[containerIndex] ?? data[0])
         )
@@ -605,7 +605,7 @@ export const Pie = defineSeriesPlugin(pluginConfig)(({ selection, name, subject,
         unsubscribeFnArr[containerIndex] = createEachPie(pluginName, {
           containerSelection: containerSelection,
           computedData$: observer.computedData$,
-          containerVisibleComputedLayoutData$: containerVisibleComputedLayoutData$,
+          containerVisibleComputedSortedData$: containerVisibleComputedSortedData$,
           SeriesDataMap$: observer.SeriesDataMap$,
           fullParams$: observer.fullParams$,
           fullChartParams$: observer.fullChartParams$,

package/src/series/plugins/PieEventTexts.ts

@@ -105,7 +105,7 @@ function createTextData ({ eventData, renderFn, textAttrs, textStyles }: {
 function createEachPieEventTexts (pluginName: string, context: {
   containerSelection: d3.Selection<SVGGElement, any, any, unknown>
   computedData$: Observable<ComputedDatumSeries[][]>
-  containerComputedLayoutData$: Observable<ComputedDatumSeries[]>
+  containerComputedSortedData$: Observable<ComputedDatumSeries[]>
   SeriesDataMap$: Observable<Map<string, ComputedDatumSeries[]>>
   fullParams$: Observable<PieEventTextsParams>
   fullChartParams$: Observable<ChartParams>
@@ -252,7 +252,7 @@ export const PieEventTexts = defineSeriesPlugin(pluginConfig)(({ selection, name
         
         const containerSelection = d3.select(g[containerIndex])
 
-        const containerComputedLayoutData$ = observer.computedLayoutData$.pipe(
+        const containerComputedSortedData$ = observer.computedSortedData$.pipe(
           takeUntil(destroy$),
           map(data => data[containerIndex] ?? data[0])
         )
@@ -265,7 +265,7 @@ export const PieEventTexts = defineSeriesPlugin(pluginConfig)(({ selection, name
         unsubscribeFnArr[containerIndex] = createEachPieEventTexts(pluginName, {
           containerSelection: containerSelection,
           computedData$: observer.computedData$,
-          containerComputedLayoutData$: containerComputedLayoutData$,
+          containerComputedSortedData$: containerComputedSortedData$,
           SeriesDataMap$: observer.SeriesDataMap$,
           fullParams$: observer.fullParams$,
           fullChartParams$: observer.fullChartParams$,

package/src/series/plugins/PieLabels.ts

@@ -447,7 +447,7 @@ function highlight ({ textSelection, lineSelection, ids, fullChartParams }: {
 function createEachPieLabel (pluginName: string, context: {
   containerSelection: d3.Selection<SVGGElement, any, any, unknown>
   // computedData$: Observable<ComputedDatumSeries[][]>
-  containerVisibleComputedLayoutData$: Observable<ComputedDatumSeries[]>
+  containerVisibleComputedSortedData$: Observable<ComputedDatumSeries[]>
   // SeriesDataMap$: Observable<Map<string, ComputedDatumSeries[]>>
   fullParams$: Observable<PieLabelsParams>
   fullChartParams$: Observable<ChartParams>
@@ -488,7 +488,7 @@ function createEachPieLabel (pluginName: string, context: {
 
   combineLatest({
     shorterSideWith: shorterSideWith$,
-    containerVisibleComputedLayoutData: context.containerVisibleComputedLayoutData$,
+    containerVisibleComputedSortedData: context.containerVisibleComputedSortedData$,
     fullParams: context.fullParams$,
     fullChartParams: context.fullChartParams$,
     textSizePx: context.textSizePx$,
@@ -516,7 +516,7 @@ function createEachPieLabel (pluginName: string, context: {
     })
 
     const pieData = makePieData({
-      data: data.containerVisibleComputedLayoutData,
+      data: data.containerVisibleComputedSortedData,
       startAngle: data.fullParams.startAngle,
       endAngle: data.fullParams.endAngle
     })
@@ -608,7 +608,7 @@ export const PieLabels = defineSeriesPlugin(pluginConfig)(({ selection, observer
         
         const containerSelection = d3.select(g[containerIndex])
 
-        const containerVisibleComputedLayoutData$ = observer.visibleComputedLayoutData$.pipe(
+        const containerVisibleComputedSortedData$ = observer.visibleComputedSortedData$.pipe(
           takeUntil(destroy$),
           map(data => data[containerIndex] ?? data[0])
         )
@@ -621,7 +621,7 @@ export const PieLabels = defineSeriesPlugin(pluginConfig)(({ selection, observer
         unsubscribeFnArr[containerIndex] = createEachPieLabel(pluginName, {
           containerSelection: containerSelection,
           // computedData$: observer.computedData$,
-          containerVisibleComputedLayoutData$: containerVisibleComputedLayoutData$,
+          containerVisibleComputedSortedData$: containerVisibleComputedSortedData$,
           // SeriesDataMap$: observer.SeriesDataMap$,
           fullParams$: observer.fullParams$,
           fullChartParams$: observer.fullChartParams$,

package/src/series/plugins/Rose.ts

@@ -213,8 +213,8 @@ function createEachRose (pluginName: string, context: {
   containerSelection: d3.Selection<SVGGElement, any, any, unknown>
   computedData$: Observable<ComputedDatumSeries[][]>
   visibleComputedData$: Observable<ComputedDatumSeries[][]>
-  visibleComputedLayoutData$: Observable<ComputedDatumSeries[][]>
-  containerVisibleComputedLayoutData$: Observable<ComputedDatumSeries[]>
+  visibleComputedSortedData$: Observable<ComputedDatumSeries[][]>
+  containerVisibleComputedSortedData$: Observable<ComputedDatumSeries[]>
   SeriesDataMap$: Observable<Map<string, ComputedDatumSeries[]>>
   fullParams$: Observable<RoseParams>
   fullChartParams$: Observable<ChartParams>
@@ -235,14 +235,14 @@ function createEachRose (pluginName: string, context: {
   )
 
   const pieData$: Observable<PieDatum[]> = combineLatest({
-    containerVisibleComputedLayoutData: context.containerVisibleComputedLayoutData$,
+    containerVisibleComputedSortedData: context.containerVisibleComputedSortedData$,
     fullParams: context.fullParams$,
   }).pipe(
     takeUntil(destroy$),
     switchMap(async (d) => d),
     map(data => {
-      const eachAngle = roseEndAngle / data.containerVisibleComputedLayoutData.length
-      return data.containerVisibleComputedLayoutData.map((d, i) => {
+      const eachAngle = roseEndAngle / data.containerVisibleComputedSortedData.length
+      return data.containerVisibleComputedSortedData.map((d, i) => {
         return {
           id: d.id,
           data: d,
@@ -263,13 +263,13 @@ function createEachRose (pluginName: string, context: {
     distinctUntilChanged()
   )
 
-  const maxValue$ = context.visibleComputedLayoutData$.pipe(
+  const maxValue$ = context.visibleComputedSortedData$.pipe(
     map(data => Math.max(...data.flat().map(d => d.value))),
     distinctUntilChanged()
   )
 
-  // context.visibleComputedLayoutData$.subscribe(data => {
-  //   console.log('visibleComputedLayoutData$', data)
+  // context.visibleComputedSortedData$.subscribe(data => {
+  //   console.log('visibleComputedSortedData$', data)
   // })
 
   const tweenArc$ = combineLatest({
@@ -483,7 +483,7 @@ export const Rose = defineSeriesPlugin(pluginConfig)(({ selection, name, subject
       seriesCenterSelection.each((d, containerIndex, g) => { 
         const containerSelection = d3.select(g[containerIndex])
 
-        const containerVisibleComputedLayoutData$ = observer.visibleComputedLayoutData$.pipe(
+        const containerVisibleComputedSortedData$ = observer.visibleComputedSortedData$.pipe(
           takeUntil(destroy$),
           map(data => JSON.parse(JSON.stringify(data[containerIndex] ?? data[0])))
         )
@@ -497,8 +497,8 @@ export const Rose = defineSeriesPlugin(pluginConfig)(({ selection, name, subject
           containerSelection: containerSelection,
           computedData$: observer.computedData$,
           visibleComputedData$: observer.visibleComputedData$,
-          visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
-          containerVisibleComputedLayoutData$: containerVisibleComputedLayoutData$,
+          visibleComputedSortedData$: observer.visibleComputedSortedData$,
+          containerVisibleComputedSortedData$: containerVisibleComputedSortedData$,
           SeriesDataMap$: observer.SeriesDataMap$,
           fullParams$: observer.fullParams$,
           fullChartParams$: observer.fullChartParams$,

package/src/series/plugins/RoseLabels.ts

@@ -406,8 +406,8 @@ function highlight ({ textSelection, lineSelection, ids, fullChartParams }: {
 function createEachPieLabel (pluginName: string, context: {
   containerSelection: d3.Selection<SVGGElement, any, any, unknown>
   // computedData$: Observable<ComputedDatumSeries[][]>
-  visibleComputedLayoutData$: Observable<ComputedDatumSeries[][]>
-  containerVisibleComputedLayoutData$: Observable<ComputedDatumSeries[]>
+  visibleComputedSortedData$: Observable<ComputedDatumSeries[][]>
+  containerVisibleComputedSortedData$: Observable<ComputedDatumSeries[]>
   // SeriesDataMap$: Observable<Map<string, ComputedDatumSeries[]>>
   fullParams$: Observable<RoseLabelsParams>
   fullChartParams$: Observable<ChartParams>
@@ -435,7 +435,7 @@ function createEachPieLabel (pluginName: string, context: {
     distinctUntilChanged()
   )
 
-  const maxValue$ = context.visibleComputedLayoutData$.pipe(
+  const maxValue$ = context.visibleComputedSortedData$.pipe(
     map(data => Math.max(...data.flat().map(d => d.value))),
     distinctUntilChanged()
   )
@@ -453,7 +453,7 @@ function createEachPieLabel (pluginName: string, context: {
   combineLatest({
     // layout: context.seriesContainerPosition$,
     shorterSideWith: shorterSideWith$,
-    containerVisibleComputedLayoutData: context.containerVisibleComputedLayoutData$,
+    containerVisibleComputedSortedData: context.containerVisibleComputedSortedData$,
     maxValue: maxValue$,
     fullParams: context.fullParams$,
     fullChartParams: context.fullChartParams$,
@@ -464,9 +464,9 @@ function createEachPieLabel (pluginName: string, context: {
     switchMap(async (d) => d),
   ).subscribe(data => {
 
-    const eachAngle = Math.PI * 2 / data.containerVisibleComputedLayoutData.length
+    const eachAngle = Math.PI * 2 / data.containerVisibleComputedSortedData.length
 
-    const pieData = data.containerVisibleComputedLayoutData.map((d, i) => {
+    const pieData = data.containerVisibleComputedSortedData.map((d, i) => {
       return {
         id: d.id,
         data: d,
@@ -567,7 +567,7 @@ export const RoseLabels = defineSeriesPlugin(pluginConfig)(({ selection, observe
         
         const containerSelection = d3.select(g[containerIndex])
 
-        const containerVisibleComputedLayoutData$ = observer.visibleComputedLayoutData$.pipe(
+        const containerVisibleComputedSortedData$ = observer.visibleComputedSortedData$.pipe(
           takeUntil(destroy$),
           map(data => JSON.parse(JSON.stringify(data[containerIndex] ?? data[0])))
         )
@@ -580,8 +580,8 @@ export const RoseLabels = defineSeriesPlugin(pluginConfig)(({ selection, observe
         unsubscribeFnArr[containerIndex] = createEachPieLabel(pluginName, {
           containerSelection: containerSelection,
           // computedData$: observer.computedData$,
-          visibleComputedLayoutData$: observer.visibleComputedLayoutData$,
-          containerVisibleComputedLayoutData$: containerVisibleComputedLayoutData$,
+          visibleComputedSortedData$: observer.visibleComputedSortedData$,
+          containerVisibleComputedSortedData$: containerVisibleComputedSortedData$,
           // SeriesDataMap$: observer.SeriesDataMap$,
           fullParams$: observer.fullParams$,
           fullChartParams$: observer.fullChartParams$,

package/dist/orbcharts-plugins-basic/src/grid/plugins/GridZoom.d.ts

@@ -1 +0,0 @@
-export declare const GridZoom: import('@orbcharts/core-types/dist/src/types/Plugin').PluginConstructor<"grid", "GridZoom", import('@orbcharts/plugins-basic-types').GridZoomParams>;

package/dist/orbcharts-plugins-basic/src/grid/plugins/StackedBar.d.ts

@@ -1 +0,0 @@
-export declare const StackedBar: import('@orbcharts/core-types/dist/src/types/Plugin').PluginConstructor<"grid", "StackedBar", import('@orbcharts/plugins-basic-types').StackedBarParams>;

package/dist/orbcharts-plugins-basic/src/index.d.ts

@@ -1,7 +0,0 @@
-export * from './grid';
-export * from './multiGrid';
-export * from './multiValue';
-export * from './noneData';
-export * from './relationship';
-export * from './series';
-export * from './tree';

package/dist/orbcharts-plugins-basic/src/multiGrid/plugins/MultiStackedBar.d.ts

@@ -1 +0,0 @@
-export declare const MultiStackedBar: import('@orbcharts/core-types/dist/src/types/Plugin').PluginConstructor<"multiGrid", "MultiStackedBar", import('@orbcharts/plugins-basic-types').MultiStackedBarParams>;

package/dist/orbcharts-plugins-basic/src/multiValue/defaults.d.ts

@@ -1,9 +0,0 @@
-import { MultiValueLegendParams, MultiValueTooltipParams, ScatterParams, ScatterBubblesParams, XYAuxParams, XYAxesParams, XYZoomParams } from '../../lib/plugins-basic-types';
-
-export declare const DEFAULT_MULTI_VALUE_LEGEND_PARAMS: MultiValueLegendParams;
-export declare const DEFAULT_MULTI_VALUE_TOOLTIP_PARAMS: MultiValueTooltipParams;
-export declare const DEFAULT_SCATTER_PARAMS: ScatterParams;
-export declare const DEFAULT_SCATTER_BUBBLES_PARAMS: ScatterBubblesParams;
-export declare const DEFAULT_X_Y_AUX_PARAMS: XYAuxParams;
-export declare const DEFAULT_X_Y_AXES_PARAMS: XYAxesParams;
-export declare const DEFAULT_X_Y_ZOOM_PARAMS: XYZoomParams;

package/dist/orbcharts-plugins-basic/src/multiValue/multiValueObservables.d.ts

@@ -1,33 +0,0 @@
-import { Observable } from 'rxjs';
-import { DataFormatterMultiValue, ComputedLayoutDatumMultiValue, TransformData, ContainerPositionScaled, Layout } from '../../lib/core-types';
-import * as d3 from 'd3';
-export declare const multiValueSelectionsObservable: ({ selection, pluginName, clipPathID, categoryLabels$, multiValueContainerPosition$, multiValueGraphicTransform$ }: {
-    selection: d3.Selection<any, unknown, any, unknown>;
-    pluginName: string;
-    clipPathID: string;
-    categoryLabels$: Observable<string[]>;
-    multiValueContainerPosition$: Observable<ContainerPositionScaled[]>;
-    multiValueGraphicTransform$: Observable<TransformData>;
-}) => {
-    categorySelection$: Observable<d3.Selection<SVGGElement, string, any, unknown>>;
-    axesSelection$: Observable<d3.Selection<SVGGElement, string, any, unknown>>;
-    defsSelection$: Observable<d3.Selection<SVGDefsElement, string, any, unknown>>;
-    graphicGSelection$: Observable<d3.Selection<SVGGElement, string, any, unknown>>;
-};
-export declare const multiValueXYPositionObservable: ({ rootSelection, fullDataFormatter$, filteredMinMaxXYData$, multiValueContainerPosition$, layout$ }: {
-    rootSelection: d3.Selection<any, unknown, any, unknown>;
-    fullDataFormatter$: Observable<DataFormatterMultiValue>;
-    filteredMinMaxXYData$: Observable<{
-        minXDatum: ComputedLayoutDatumMultiValue;
-        maxXDatum: ComputedLayoutDatumMultiValue;
-        minYDatum: ComputedLayoutDatumMultiValue;
-        maxYDatum: ComputedLayoutDatumMultiValue;
-    }>;
-    multiValueContainerPosition$: Observable<ContainerPositionScaled[]>;
-    layout$: Observable<Layout>;
-}) => Observable<{
-    x: number;
-    y: number;
-    xValue: number;
-    yValue: number;
-}>;

package/dist/orbcharts-plugins-basic/src/multiValue/plugins/XYZoom.d.ts

@@ -1 +0,0 @@
-export declare const XYZoom: import('@orbcharts/core-types/dist/src/types/Plugin').PluginConstructor<"multiValue", "XYZoom", import('@orbcharts/plugins-basic-types').XYZoomParams>;