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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/orbcharts-plugins-basic.es.js +7770 -7580
  2. package/dist/orbcharts-plugins-basic.umd.js +8 -8
  3. package/dist/src/base/BaseBarStack.d.ts +6 -4
  4. package/dist/src/base/BaseBars.d.ts +6 -4
  5. package/dist/src/base/BaseBarsTriangle.d.ts +7 -4
  6. package/dist/src/base/BaseDots.d.ts +5 -3
  7. package/dist/src/base/BaseGroupAxis.d.ts +3 -3
  8. package/dist/src/base/BaseLineAreas.d.ts +6 -3
  9. package/dist/src/base/BaseLines.d.ts +6 -3
  10. package/dist/src/base/BaseValueAxis.d.ts +3 -3
  11. package/dist/src/grid/gridObservables.d.ts +4 -4
  12. package/dist/src/multiGrid/multiGridObservables.d.ts +2 -6
  13. package/dist/src/series/plugins/PieEventTexts.d.ts +3 -1
  14. package/dist/src/series/seriesObservables.d.ts +21 -0
  15. package/dist/src/series/seriesUtils.d.ts +3 -3
  16. package/package.json +2 -2
  17. package/src/base/BaseBarStack.ts +105 -208
  18. package/src/base/BaseBars.ts +78 -64
  19. package/src/base/BaseBarsTriangle.ts +76 -63
  20. package/src/base/BaseDots.ts +41 -178
  21. package/src/base/BaseGroupAxis.ts +13 -13
  22. package/src/base/BaseLineAreas.ts +85 -81
  23. package/src/base/BaseLines.ts +82 -75
  24. package/src/base/BaseValueAxis.ts +14 -15
  25. package/src/grid/gridObservables.ts +22 -38
  26. package/src/grid/plugins/BarStack.ts +16 -3
  27. package/src/grid/plugins/Bars.ts +18 -4
  28. package/src/grid/plugins/BarsDiverging.ts +6 -4
  29. package/src/grid/plugins/BarsTriangle.ts +20 -4
  30. package/src/grid/plugins/Dots.ts +4 -2
  31. package/src/grid/plugins/GroupAux.ts +1 -2
  32. package/src/grid/plugins/GroupAxis.ts +15 -3
  33. package/src/grid/plugins/LineAreas.ts +5 -2
  34. package/src/grid/plugins/Lines.ts +5 -2
  35. package/src/grid/plugins/ScalingArea.ts +0 -1
  36. package/src/grid/plugins/ValueAxis.ts +15 -3
  37. package/src/grid/plugins/ValueStackAxis.ts +14 -5
  38. package/src/multiGrid/multiGridObservables.ts +14 -261
  39. package/src/multiGrid/plugins/MultiBarStack.ts +22 -8
  40. package/src/multiGrid/plugins/MultiBars.ts +21 -7
  41. package/src/multiGrid/plugins/MultiBarsTriangle.ts +22 -7
  42. package/src/multiGrid/plugins/MultiDots.ts +7 -5
  43. package/src/multiGrid/plugins/MultiGridLegend.ts +1 -1
  44. package/src/multiGrid/plugins/MultiGroupAxis.ts +19 -7
  45. package/src/multiGrid/plugins/MultiLineAreas.ts +9 -6
  46. package/src/multiGrid/plugins/MultiLines.ts +9 -6
  47. package/src/multiGrid/plugins/MultiValueAxis.ts +19 -7
  48. package/src/multiGrid/plugins/OverlappingValueAxes.ts +52 -47
  49. package/src/noneData/defaults.ts +3 -0
  50. package/src/series/defaults.ts +13 -3
  51. package/src/series/plugins/Bubbles.ts +139 -88
  52. package/src/series/plugins/Pie.ts +307 -352
  53. package/src/series/plugins/PieEventTexts.ts +102 -38
  54. package/src/series/plugins/PieLabels.ts +95 -48
  55. package/src/series/seriesObservables.ts +145 -0
  56. package/src/series/seriesUtils.ts +4 -4
  57. package/tsconfig.json +1 -1
@@ -12,15 +12,18 @@ import type { BasePluginFn } from './types'
12
12
  import type {
13
13
  ComputedDatumGrid,
14
14
  ComputedDataGrid,
15
+ ComputedLayoutDatumGrid,
16
+ ComputedLayoutDataGrid,
15
17
  DataFormatterGrid,
16
18
  EventGrid,
17
19
  ChartParams,
18
- ContainerPosition,
20
+ GridContainerPosition,
19
21
  Layout,
20
22
  TransformData } from '@orbcharts/core'
21
23
  import { getD3TransitionEase } from '../utils/d3Utils'
22
24
  import { getClassName, getUniID } from '../utils/orbchartsUtils'
23
25
  import { gridSelectionsObservable } from '../grid/gridObservables'
26
+ import { shareReplay } from 'rxjs/operators'
24
27
 
25
28
  export interface BaseBarStackParams {
26
29
  barWidth: number
@@ -31,8 +34,10 @@ export interface BaseBarStackParams {
31
34
  interface BaseBarStackContext {
32
35
  selection: d3.Selection<any, unknown, any, unknown>
33
36
  computedData$: Observable<ComputedDataGrid>
37
+ computedLayoutData$: Observable<ComputedLayoutDataGrid>
34
38
  visibleComputedData$: Observable<ComputedDatumGrid[][]>
35
- existSeriesLabels$: Observable<string[]>
39
+ visibleComputedLayoutData$: Observable<ComputedLayoutDataGrid>
40
+ seriesLabels$: Observable<string[]>
36
41
  SeriesDataMap$: Observable<Map<string, ComputedDatumGrid[]>>
37
42
  GroupDataMap$: Observable<Map<string, ComputedDatumGrid[]>>
38
43
  fullParams$: Observable<BaseBarStackParams>
@@ -46,13 +51,13 @@ interface BaseBarStackContext {
46
51
  height: number;
47
52
  }>
48
53
  gridHighlight$: Observable<ComputedDatumGrid[]>
49
- gridContainer$: Observable<ContainerPosition[]>
50
- isSeriesPositionSeprate$: Observable<boolean>
54
+ gridContainerPosition$: Observable<GridContainerPosition[]>
55
+ isSeriesSeprate$: Observable<boolean>
51
56
  event$: Subject<EventGrid>
52
57
  }
53
58
 
54
59
 
55
- interface GraphicDatum extends ComputedDatumGrid {
60
+ interface GraphicDatum extends ComputedLayoutDatumGrid {
56
61
  _barStartY: number // bar的起點y座標
57
62
  _barHeight: number // bar的高度
58
63
  }
@@ -70,7 +75,7 @@ interface RenderBarParams {
70
75
  transformedBarRadius: [number, number][]
71
76
  delayGroup: number
72
77
  transitionItem: number
73
- isSeriesPositionSeprate: boolean
78
+ isSeriesSeprate: boolean
74
79
  }
75
80
 
76
81
  type ClipPathDatum = {
@@ -121,7 +126,7 @@ function calctransitionItem (barGroupAmount: number, totalDuration: number) {
121
126
  return totalDuration * (1 - groupDelayProportionOfDuration) // delay後剩餘的時間
122
127
  }
123
128
 
124
- function renderRectBars ({ graphicGSelection, rectClassName, barData, zeroY, groupLabels, params, chartParams, barWidth, transformedBarRadius, delayGroup, transitionItem, isSeriesPositionSeprate }: RenderBarParams) {
129
+ function renderRectBars ({ graphicGSelection, rectClassName, barData, zeroY, groupLabels, params, chartParams, barWidth, transformedBarRadius, delayGroup, transitionItem, isSeriesSeprate }: RenderBarParams) {
125
130
 
126
131
  const barHalfWidth = barWidth! / 2
127
132
 
@@ -287,8 +292,10 @@ function highlight ({ selection, ids, fullChartParams }: {
287
292
  export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName: string, {
288
293
  selection,
289
294
  computedData$,
295
+ computedLayoutData$,
290
296
  visibleComputedData$,
291
- existSeriesLabels$,
297
+ visibleComputedLayoutData$,
298
+ seriesLabels$,
292
299
  SeriesDataMap$,
293
300
  GroupDataMap$,
294
301
  fullParams$,
@@ -299,8 +306,8 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
299
306
  gridGraphicReverseScale$,
300
307
  gridAxesSize$,
301
308
  gridHighlight$,
302
- gridContainer$,
303
- isSeriesPositionSeprate$,
309
+ gridContainerPosition$,
310
+ isSeriesSeprate$,
304
311
  event$
305
312
  }) => {
306
313
 
@@ -309,136 +316,6 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
309
316
  const clipPathID = getUniID(pluginName, 'clipPath-box')
310
317
  const rectClassName = getClassName(pluginName, 'rect')
311
318
 
312
- // const axisSelection: d3.Selection<SVGGElement, any, any, any> = selection
313
- // .append('g')
314
- // .attr('clip-path', `url(#${clipPathID})`)
315
- // const defsSelection: d3.Selection<SVGDefsElement, ComputedDatumGrid, any, any> = axisSelection.append('defs')
316
- // const graphicGSelection: d3.Selection<SVGGElement, any, any, any> = axisSelection.append('g')
317
- // const barSelection$: Subject<d3.Selection<SVGRectElement, ComputedDatumGrid, SVGGElement, unknown>> = new Subject()
318
-
319
- // gridAxesTransform$
320
- // .pipe(
321
- // takeUntil(destroy$),
322
- // map(d => d.value),
323
- // distinctUntilChanged()
324
- // ).subscribe(d => {
325
- // axisSelection
326
- // .style('transform', d)
327
- // })
328
-
329
- // gridGraphicTransform$
330
- // .pipe(
331
- // takeUntil(destroy$),
332
- // switchMap(async d => d.value),
333
- // distinctUntilChanged()
334
- // ).subscribe(d => {
335
- // graphicGSelection
336
- // .transition()
337
- // .duration(50)
338
- // .style('transform', d)
339
- // })
340
-
341
- // const seriesSelection$ = computedData$.pipe(
342
- // takeUntil(destroy$),
343
- // distinctUntilChanged((a, b) => {
344
- // // 只有當series的數量改變時,才重新計算
345
- // return a.length === b.length
346
- // }),
347
- // map((computedData, i) => {
348
- // return selection
349
- // .selectAll<SVGGElement, ComputedDatumGrid[]>(`g.${seriesClassName}`)
350
- // .data(computedData, d => d[0] ? d[0].seriesIndex : i)
351
- // .join(
352
- // enter => {
353
- // return enter
354
- // .append('g')
355
- // .classed(seriesClassName, true)
356
- // .each((d, i, g) => {
357
- // const axesSelection = d3.select(g[i])
358
- // .selectAll<SVGGElement, ComputedDatumGrid[]>(`g.${axesClassName}`)
359
- // .data([i])
360
- // .join(
361
- // enter => {
362
- // return enter
363
- // .append('g')
364
- // .classed(axesClassName, true)
365
- // .attr('clip-path', `url(#${clipPathID})`)
366
- // .each((d, i, g) => {
367
- // const defsSelection = d3.select(g[i])
368
- // .selectAll<SVGDefsElement, any>('defs')
369
- // .data([i])
370
- // .join('defs')
371
-
372
- // const graphicGSelection = d3.select(g[i])
373
- // .selectAll<SVGGElement, any>('g')
374
- // .data([i])
375
- // .join('g')
376
- // .classed(graphicClassName, true)
377
- // })
378
- // },
379
- // update => update,
380
- // exit => exit.remove()
381
- // )
382
- // })
383
- // },
384
- // update => update,
385
- // exit => exit.remove()
386
- // )
387
- // })
388
- // )
389
-
390
- // combineLatest({
391
- // seriesSelection: seriesSelection$,
392
- // gridContainer: gridContainer$
393
- // }).pipe(
394
- // takeUntil(destroy$),
395
- // switchMap(async d => d)
396
- // ).subscribe(data => {
397
- // data.seriesSelection
398
- // .transition()
399
- // .attr('transform', (d, i) => {
400
- // const translate = data.gridContainer[i].translate
401
- // const scale = data.gridContainer[i].scale
402
- // return `translate(${translate[0]}, ${translate[1]}) scale(${scale[0]}, ${scale[1]})`
403
- // })
404
- // })
405
-
406
-
407
- // const axesSelection$ = combineLatest({
408
- // seriesSelection: seriesSelection$,
409
- // gridAxesTransform: gridAxesTransform$
410
- // }).pipe(
411
- // takeUntil(destroy$),
412
- // switchMap(async d => d),
413
- // map(data => {
414
- // return data.seriesSelection
415
- // .select<SVGGElement>(`g.${axesClassName}`)
416
- // .style('transform', data.gridAxesTransform.value)
417
- // })
418
- // )
419
- // const defsSelection$ = axesSelection$.pipe(
420
- // takeUntil(destroy$),
421
- // map(axesSelection => {
422
- // return axesSelection.select<SVGDefsElement>('defs')
423
- // })
424
- // )
425
- // const graphicGSelection$ = combineLatest({
426
- // axesSelection: axesSelection$,
427
- // gridGraphicTransform: gridGraphicTransform$
428
- // }).pipe(
429
- // takeUntil(destroy$),
430
- // switchMap(async d => d),
431
- // map(data => {
432
- // const graphicGSelection = data.axesSelection
433
- // .select<SVGGElement>(`g.${graphicClassName}`)
434
- // graphicGSelection
435
- // .transition()
436
- // .duration(50)
437
- // .style('transform', data.gridGraphicTransform.value)
438
- // return graphicGSelection
439
- // })
440
- // )
441
-
442
319
  const {
443
320
  seriesSelection$,
444
321
  axesSelection$,
@@ -448,14 +325,14 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
448
325
  selection,
449
326
  pluginName,
450
327
  clipPathID,
451
- existSeriesLabels$,
452
- gridContainer$,
328
+ seriesLabels$,
329
+ gridContainerPosition$,
453
330
  gridAxesTransform$,
454
331
  gridGraphicTransform$
455
332
  })
456
333
 
457
334
 
458
- const zeroY$ = visibleComputedData$.pipe(
335
+ const zeroY$ = visibleComputedLayoutData$.pipe(
459
336
  takeUntil(destroy$),
460
337
  map(d => d[0] && d[0][0]
461
338
  ? d[0][0].axisY - d[0][0].axisYFromZero
@@ -468,7 +345,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
468
345
  // visibleComputedData: visibleComputedData$,
469
346
  params: fullParams$,
470
347
  axisSize: gridAxesSize$,
471
- isSeriesPositionSeprate: isSeriesPositionSeprate$
348
+ isSeriesSeprate: isSeriesSeprate$
472
349
  }).pipe(
473
350
  takeUntil(destroy$),
474
351
  switchMap(async d => d),
@@ -536,7 +413,8 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
536
413
  })
537
414
  })
538
415
  return Array.from(GroupLabelSet)
539
- })
416
+ }),
417
+ shareReplay(1)
540
418
  )
541
419
 
542
420
  const transitionDuration$ = fullChartParams$.pipe(
@@ -598,7 +476,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
598
476
  // })
599
477
  // )
600
478
 
601
- const yRatio$ = combineLatest({
479
+ const groupScaleDomain$ = combineLatest({
602
480
  computedData: computedData$,
603
481
  dataFormatter: fullDataFormatter$,
604
482
  }).pipe(
@@ -608,56 +486,70 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
608
486
  const groupMin = 0
609
487
  const groupMax = data.computedData[0] ? data.computedData[0].length - 1 : 0
610
488
  const groupScaleDomainMin = data.dataFormatter.grid.groupAxis.scaleDomain[0] === 'auto'
611
- ? groupMin - data.dataFormatter.grid.groupAxis.scalePadding
612
- : data.dataFormatter.grid.groupAxis.scaleDomain[0] as number - data.dataFormatter.grid.groupAxis.scalePadding
489
+ ? groupMin // - data.dataFormatter.grid.groupAxis.scalePadding
490
+ : data.dataFormatter.grid.groupAxis.scaleDomain[0] as number // - data.dataFormatter.grid.groupAxis.scalePadding
613
491
  const groupScaleDomainMax = data.dataFormatter.grid.groupAxis.scaleDomain[1] === 'auto'
614
- ? groupMax + data.dataFormatter.grid.groupAxis.scalePadding
615
- : data.dataFormatter.grid.groupAxis.scaleDomain[1] as number + data.dataFormatter.grid.groupAxis.scalePadding
616
-
617
- const filteredData = data.computedData
492
+ ? groupMax // + data.dataFormatter.grid.groupAxis.scalePadding
493
+ : data.dataFormatter.grid.groupAxis.scaleDomain[1] as number // + data.dataFormatter.grid.groupAxis.scalePadding
494
+
495
+ return [groupScaleDomainMin, groupScaleDomainMax]
496
+ })
497
+ )
498
+
499
+ // 堆疊後的高度對應圖軸的比例(最大值/最大值所在group的總和)
500
+ const yRatio$ = combineLatest({
501
+ visibleComputedLayoutData: visibleComputedLayoutData$,
502
+ groupScaleDomain: groupScaleDomain$
503
+ }).pipe(
504
+ takeUntil(destroy$),
505
+ switchMap(async d => d),
506
+ map(data => {
507
+ const groupScaleDomainMin = data.groupScaleDomain[0]
508
+ const groupScaleDomainMax = data.groupScaleDomain[1]
509
+ // 只選取group篩選範圍內的資料
510
+ const filteredData = data.visibleComputedLayoutData
618
511
  .map(d => {
619
512
  return d.filter((_d, i) => {
620
513
  return _d.groupIndex >= groupScaleDomainMin && _d.groupIndex <= groupScaleDomainMax
621
514
  })
622
515
  })
623
- // console.log('filteredData', filteredData)
624
-
625
- if (filteredData.length <= 1) {
516
+
517
+ const filteredDataList = filteredData.flat()
518
+ if (filteredDataList.length <= 1) {
626
519
  return 1
627
- } else {
628
- const yArr = filteredData.flat().map(d => d.axisYFromZero)
629
- const barMaxY = Math.max(...yArr)
630
- // const stackYArr = filteredData.map(d => d.reduce((prev, current) => prev + current.axisYFromZero, 0))
631
- const stackYArr = data.computedData[0]
632
- ? data.computedData[0].map((_, groupIndex) => {
633
- // 加總同一group的value
634
- return data.computedData.reduce((prev, current) => {
635
- return prev + current[groupIndex].axisYFromZero
636
- }, 0)
637
- })
638
- : []
639
- const barStackMaxY = Math.max(...stackYArr)
640
-
641
- return barMaxY / barStackMaxY
642
520
  }
521
+
522
+ const maxValueDatum = filteredDataList.reduce((max, current) => {
523
+ return current.value > max.value ? current : max;
524
+ }, filteredDataList[0])
525
+ const maxValueGroupIndex = maxValueDatum.groupIndex
526
+ const maxValueGroupSum = filteredDataList
527
+ .filter(d => d.groupIndex === maxValueGroupIndex)
528
+ .reduce((sum, current) => {
529
+ return sum + current.value
530
+ }, 0)
531
+ return maxValueDatum.value / maxValueGroupSum
643
532
  })
644
533
  )
645
534
 
646
535
  const stackedData$ = combineLatest({
647
- computedData: computedData$,
536
+ computedLayoutData: computedLayoutData$,
648
537
  yRatio: yRatio$,
649
538
  zeroY: zeroY$
650
539
  }).pipe(
651
540
  takeUntil(destroy$),
652
541
  map(data => {
653
- let accYArr: number[] = data.computedData[0]
654
- ? data.computedData[0].map(() => data.zeroY)
542
+ let accYArr: number[] = data.computedLayoutData[0]
543
+ ? data.computedLayoutData[0].map(() => data.zeroY)
655
544
  : []
656
- return data.computedData.map((series, seriesIndex) => {
545
+ return data.computedLayoutData.map((series, seriesIndex) => {
657
546
  return series.map((datum, groupIndex) => {
658
547
  const _barStartY = accYArr[groupIndex] // 前一次的累加高度
659
- const _barHeight = datum.axisYFromZero * data.yRatio
660
- accYArr[groupIndex] = accYArr[groupIndex] + _barHeight // 累加高度
548
+ let _barHeight = 0
549
+ if (datum.visible) {
550
+ _barHeight = datum.axisYFromZero * data.yRatio
551
+ accYArr[groupIndex] = accYArr[groupIndex] + _barHeight // 累加高度
552
+ }
661
553
  return <GraphicDatum>{
662
554
  ...datum,
663
555
  _barStartY,
@@ -682,13 +574,13 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
682
574
  )
683
575
 
684
576
  const noneStackedData$ = combineLatest({
685
- computedData: computedData$,
577
+ computedLayoutData: computedLayoutData$,
686
578
  // yRatio: yRatio$,
687
579
  zeroY: zeroY$
688
580
  }).pipe(
689
581
  takeUntil(destroy$),
690
582
  map(data => {
691
- return data.computedData.map((series, seriesIndex) => {
583
+ return data.computedLayoutData.map((series, seriesIndex) => {
692
584
  return series.map((datum, groupIndex) => {
693
585
  return <GraphicDatum>{
694
586
  ...datum,
@@ -700,9 +592,9 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
700
592
  })
701
593
  )
702
594
 
703
- const graphicData$ = isSeriesPositionSeprate$.pipe(
704
- switchMap(isSeriesPositionSeprate => {
705
- return iif(() => isSeriesPositionSeprate, noneStackedData$, stackedData$)
595
+ const graphicData$ = isSeriesSeprate$.pipe(
596
+ switchMap(isSeriesSeprate => {
597
+ return iif(() => isSeriesSeprate, noneStackedData$, stackedData$)
706
598
  })
707
599
  )
708
600
 
@@ -730,9 +622,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
730
622
  distinctUntilChanged()
731
623
  )
732
624
 
733
- const barSelection$ = new Subject<d3.Selection<SVGRectElement, ComputedDatumGrid, SVGGElement, unknown>>()
734
-
735
- combineLatest({
625
+ const barSelection$ = combineLatest({
736
626
  graphicGSelection: graphicGSelection$,
737
627
  graphicData: graphicData$,
738
628
  zeroY: zeroY$,
@@ -745,30 +635,38 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
745
635
  transformedBarRadius: transformedBarRadius$,
746
636
  delayGroup: delayGroup$,
747
637
  transitionItem: transitionItem$,
748
- SeriesDataMap: SeriesDataMap$,
749
- GroupDataMap: GroupDataMap$,
750
- isSeriesPositionSeprate: isSeriesPositionSeprate$
638
+ isSeriesSeprate: isSeriesSeprate$
751
639
  }).pipe(
752
640
  takeUntil(destroy$),
753
641
  switchMap(async (d) => d),
754
- ).subscribe(data => {
755
- const barSelection = renderRectBars({
756
- graphicGSelection: data.graphicGSelection,
757
- rectClassName,
758
- barData: data.graphicData,
759
- zeroY: data.zeroY,
760
- groupLabels: data.groupLabels,
761
- // barScale: data.barScale,
762
- params: data.params,
763
- chartParams: data.chartParams,
764
- barWidth: data.barWidth,
765
- transformedBarRadius: data.transformedBarRadius,
766
- delayGroup: data.delayGroup,
767
- transitionItem: data.transitionItem,
768
- isSeriesPositionSeprate: data.isSeriesPositionSeprate
642
+ map(data => {
643
+ return renderRectBars({
644
+ graphicGSelection: data.graphicGSelection,
645
+ rectClassName,
646
+ barData: data.graphicData,
647
+ zeroY: data.zeroY,
648
+ groupLabels: data.groupLabels,
649
+ // barScale: data.barScale,
650
+ params: data.params,
651
+ chartParams: data.chartParams,
652
+ barWidth: data.barWidth,
653
+ transformedBarRadius: data.transformedBarRadius,
654
+ delayGroup: data.delayGroup,
655
+ transitionItem: data.transitionItem,
656
+ isSeriesSeprate: data.isSeriesSeprate
657
+ })
769
658
  })
659
+ )
660
+
661
+ combineLatest({
662
+ barSelection: barSelection$,
663
+ computedData: computedData$,
664
+ highlightTarget: highlightTarget$,
665
+ SeriesDataMap: SeriesDataMap$,
666
+ GroupDataMap: GroupDataMap$,
667
+ }).subscribe(data => {
770
668
 
771
- barSelection!
669
+ data.barSelection!
772
670
  .on('mouseover', (event, datum) => {
773
671
  event.stopPropagation()
774
672
 
@@ -786,7 +684,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
786
684
  groupIndex: datum.groupIndex,
787
685
  groupLabel: datum.groupLabel,
788
686
  event,
789
- data: data.graphicData
687
+ data: data.computedData
790
688
  })
791
689
  })
792
690
  .on('mousemove', (event, datum) => {
@@ -806,7 +704,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
806
704
  groupIndex: datum.groupIndex,
807
705
  groupLabel: datum.groupLabel,
808
706
  event,
809
- data: data.graphicData
707
+ data: data.computedData
810
708
  })
811
709
  })
812
710
  .on('mouseout', (event, datum) => {
@@ -826,7 +724,7 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
826
724
  groupIndex: datum.groupIndex,
827
725
  groupLabel: datum.groupLabel,
828
726
  event,
829
- data: data.graphicData
727
+ data: data.computedData
830
728
  })
831
729
  })
832
730
  .on('click', (event, datum) => {
@@ -846,11 +744,10 @@ export const createBaseBarStack: BasePluginFn<BaseBarStackContext> = (pluginName
846
744
  groupIndex: datum.groupIndex,
847
745
  groupLabel: datum.groupLabel,
848
746
  event,
849
- data: data.graphicData
747
+ data: data.computedData
850
748
  })
851
749
  })
852
750
 
853
- barSelection$.next(barSelection!)
854
751
  })
855
752
 
856
753
  // const datumList$ = computedData$.pipe(