@orbcharts/plugins-basic 3.0.0-alpha.49 → 3.0.0-alpha.51

Sign up to get free protection for your applications and to get access to all the features.
Files changed (91) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-plugins-basic.es.js +6325 -6272
  3. package/dist/orbcharts-plugins-basic.umd.js +8 -8
  4. package/dist/src/base/BaseGroupAxis.d.ts +1 -0
  5. package/dist/src/grid/index.d.ts +1 -1
  6. package/dist/src/grid/plugins/BarsPN.d.ts +1 -0
  7. package/dist/src/grid/types.d.ts +3 -2
  8. package/dist/src/multiGrid/defaults.d.ts +2 -1
  9. package/dist/src/multiGrid/index.d.ts +2 -0
  10. package/dist/src/multiGrid/multiGridObservables.d.ts +1 -1
  11. package/dist/src/multiGrid/plugins/MultiValueStackAxis.d.ts +1 -0
  12. package/dist/src/multiGrid/plugins/OverlappingValueStackAxes.d.ts +1 -0
  13. package/dist/src/multiGrid/types.d.ts +3 -0
  14. package/dist/src/series/types.d.ts +2 -3
  15. package/package.json +42 -42
  16. package/src/base/BaseBarStack.ts +778 -778
  17. package/src/base/BaseBars.ts +764 -764
  18. package/src/base/BaseBarsTriangle.ts +672 -672
  19. package/src/base/BaseDots.ts +513 -502
  20. package/src/base/BaseGroupAxis.ts +562 -496
  21. package/src/base/BaseLegend.ts +641 -641
  22. package/src/base/BaseLineAreas.ts +625 -625
  23. package/src/base/BaseLines.ts +699 -699
  24. package/src/base/BaseValueAxis.ts +478 -478
  25. package/src/base/types.ts +2 -2
  26. package/src/grid/defaults.ts +125 -121
  27. package/src/grid/gridObservables.ts +248 -247
  28. package/src/grid/index.ts +15 -15
  29. package/src/grid/plugins/BarStack.ts +43 -50
  30. package/src/grid/plugins/Bars.ts +44 -51
  31. package/src/grid/plugins/{BarsDiverging.ts → BarsPN.ts} +41 -41
  32. package/src/grid/plugins/BarsTriangle.ts +42 -50
  33. package/src/grid/plugins/Dots.ts +37 -37
  34. package/src/grid/plugins/GridLegend.ts +59 -59
  35. package/src/grid/plugins/GroupAux.ts +645 -645
  36. package/src/grid/plugins/GroupAxis.ts +35 -42
  37. package/src/grid/plugins/LineAreas.ts +39 -39
  38. package/src/grid/plugins/Lines.ts +38 -38
  39. package/src/grid/plugins/ScalingArea.ts +173 -173
  40. package/src/grid/plugins/ValueAxis.ts +36 -43
  41. package/src/grid/plugins/ValueStackAxis.ts +38 -79
  42. package/src/grid/types.ts +122 -120
  43. package/src/index.ts +9 -9
  44. package/src/multiGrid/defaults.ts +152 -147
  45. package/src/multiGrid/index.ts +14 -12
  46. package/src/multiGrid/multiGridObservables.ts +44 -43
  47. package/src/multiGrid/plugins/MultiBarStack.ts +78 -78
  48. package/src/multiGrid/plugins/MultiBars.ts +77 -77
  49. package/src/multiGrid/plugins/MultiBarsTriangle.ts +77 -77
  50. package/src/multiGrid/plugins/MultiDots.ts +65 -65
  51. package/src/multiGrid/plugins/MultiGridLegend.ts +89 -89
  52. package/src/multiGrid/plugins/MultiGroupAxis.ts +69 -69
  53. package/src/multiGrid/plugins/MultiLineAreas.ts +67 -67
  54. package/src/multiGrid/plugins/MultiLines.ts +66 -66
  55. package/src/multiGrid/plugins/MultiValueAxis.ts +69 -69
  56. package/src/multiGrid/plugins/MultiValueStackAxis.ts +69 -0
  57. package/src/multiGrid/plugins/OverlappingValueAxes.ts +166 -173
  58. package/src/multiGrid/plugins/OverlappingValueStackAxes.ts +167 -0
  59. package/src/multiGrid/types.ts +71 -67
  60. package/src/noneData/defaults.ts +64 -64
  61. package/src/noneData/index.ts +3 -3
  62. package/src/noneData/plugins/Container.ts +10 -10
  63. package/src/noneData/plugins/Tooltip.ts +310 -310
  64. package/src/noneData/types.ts +26 -26
  65. package/src/series/defaults.ts +126 -126
  66. package/src/series/index.ts +9 -9
  67. package/src/series/plugins/Bubbles.ts +545 -602
  68. package/src/series/plugins/Pie.ts +576 -576
  69. package/src/series/plugins/PieEventTexts.ts +262 -262
  70. package/src/series/plugins/PieLabels.ts +304 -304
  71. package/src/series/plugins/Rose.ts +472 -472
  72. package/src/series/plugins/RoseLabels.ts +362 -362
  73. package/src/series/plugins/SeriesLegend.ts +59 -59
  74. package/src/series/seriesObservables.ts +145 -145
  75. package/src/series/seriesUtils.ts +51 -51
  76. package/src/series/types.ts +83 -83
  77. package/src/tree/defaults.ts +22 -22
  78. package/src/tree/index.ts +3 -3
  79. package/src/tree/plugins/TreeLegend.ts +59 -59
  80. package/src/tree/plugins/TreeMap.ts +305 -305
  81. package/src/tree/types.ts +23 -23
  82. package/src/utils/commonUtils.ts +21 -21
  83. package/src/utils/d3Graphics.ts +124 -124
  84. package/src/utils/d3Utils.ts +73 -73
  85. package/src/utils/observables.ts +14 -14
  86. package/src/utils/orbchartsUtils.ts +100 -100
  87. package/tsconfig.dev.json +16 -16
  88. package/tsconfig.json +13 -13
  89. package/tsconfig.prod.json +13 -13
  90. package/vite.config.js +49 -49
  91. package/dist/src/grid/plugins/BarsDiverging.d.ts +0 -1
@@ -1,147 +1,152 @@
1
- import type {
2
- MultiGridLegendParams,
3
- MultiBarsParams,
4
- MultiBarStackParams,
5
- MultiBarsTriangleParams,
6
- MultiLinesParams,
7
- MultiLineAreasParams,
8
- MultiDotsParams,
9
- MultiGroupAxisParams,
10
- MultiValueAxisParams,
11
- OverlappingValueAxesParams
12
- } from './types'
13
-
14
- export const DEFAULT_MULTI_GRID_LEGEND_PARAMS: MultiGridLegendParams = {
15
- position: 'right',
16
- justify: 'end',
17
- padding: 28,
18
- backgroundFill: 'none',
19
- backgroundStroke: 'none',
20
- gap: 10,
21
- listRectWidth: 14,
22
- listRectHeight: 14,
23
- listRectRadius: 0,
24
- gridList: [
25
- {
26
- listRectWidth: 14,
27
- listRectHeight: 14,
28
- listRectRadius: 0,
29
- }
30
- ],
31
- textColorType: 'primary'
32
- }
33
-
34
- export const DEFAULT_MULTI_GROUP_AXIS_PARAMS: MultiGroupAxisParams = {
35
- // labelAnchor: 'start',
36
- labelOffset: [0, 0],
37
- labelColorType: 'primary',
38
- axisLineVisible: true,
39
- axisLineColorType: 'primary',
40
- tickFormat: text => text,
41
- tickLineVisible: true,
42
- tickPadding: 20,
43
- tickFullLine: false,
44
- tickFullLineDasharray: 'none',
45
- tickColorType: 'secondary',
46
- tickTextRotate: 0,
47
- tickTextColorType: 'primary',
48
- gridIndexes: [0]
49
- }
50
-
51
- export const DEFAULT_MULTI_VALUE_AXIS_PARAMS: MultiValueAxisParams = {
52
- // labelAnchor: 'end',
53
- labelOffset: [0, 0],
54
- labelColorType: 'primary',
55
- axisLineVisible: false,
56
- axisLineColorType: 'primary',
57
- ticks: 4,
58
- tickFormat: ',.0f',
59
- tickLineVisible: true,
60
- tickPadding: 20,
61
- tickFullLine: true,
62
- tickFullLineDasharray: 'none',
63
- tickColorType: 'secondary',
64
- tickTextRotate: 0,
65
- tickTextColorType: 'primary',
66
- gridIndexes: [0]
67
- }
68
-
69
- export const DEFAULT_MULTI_BARS_PARAMS: MultiBarsParams = {
70
- barWidth: 0,
71
- barPadding: 1,
72
- barGroupPadding: 40,
73
- barRadius: false,
74
- gridIndexes: [0]
75
- }
76
-
77
- export const DEFAULT_MULTI_BAR_STACK_PARAMS: MultiBarStackParams = {
78
- barWidth: 0,
79
- barGroupPadding: 10,
80
- barRadius: false,
81
- gridIndexes: [0]
82
- }
83
-
84
- export const DEFAULT_MULTI_BARS_TRIANGLE_PARAMS: MultiBarsTriangleParams = {
85
- barWidth: 0,
86
- barPadding: 1,
87
- barGroupPadding: 20,
88
- linearGradientOpacity: [1, 0],
89
- gridIndexes: [0]
90
- }
91
-
92
- export const DEFAULT_MULTI_LINES_PARAMS: MultiLinesParams = {
93
- lineCurve: 'curveLinear',
94
- lineWidth: 2,
95
- gridIndexes: [1]
96
- }
97
-
98
- export const DEFAULT_MULTI_LINE_AREAS_PARAMS: MultiLineAreasParams = {
99
- lineCurve: 'curveLinear',
100
- linearGradientOpacity: [1, 0],
101
- gridIndexes: [1]
102
- }
103
-
104
- export const DEFAULT_MULTI_DOTS_PARAMS: MultiDotsParams = {
105
- radius: 4,
106
- fillColorType: 'white',
107
- strokeColorType: 'series',
108
- strokeWidth: 2,
109
- onlyShowHighlighted: false,
110
- gridIndexes: [1]
111
- }
112
-
113
- export const DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS: OverlappingValueAxesParams = {
114
- firstAxis: {
115
- // labelAnchor: 'end',
116
- labelOffset: [0, 0],
117
- labelColorType: 'primary',
118
- axisLineVisible: false,
119
- axisLineColorType: 'primary',
120
- ticks: 4,
121
- tickFormat: ',.0f',
122
- tickLineVisible: true,
123
- tickPadding: 20,
124
- tickFullLine: true,
125
- tickFullLineDasharray: 'none',
126
- tickColorType: 'secondary',
127
- tickTextRotate: 0,
128
- tickTextColorType: 'primary',
129
- },
130
- secondAxis: {
131
- // labelAnchor: 'end',
132
- labelOffset: [0, 0],
133
- labelColorType: 'primary',
134
- axisLineVisible: false,
135
- axisLineColorType: 'primary',
136
- ticks: 4,
137
- tickFormat: ',.0f',
138
- tickLineVisible: true,
139
- tickPadding: 20,
140
- tickFullLine: true,
141
- tickFullLineDasharray: 'none',
142
- tickColorType: 'secondary',
143
- tickTextRotate: 0,
144
- tickTextColorType: 'primary',
145
- },
146
- gridIndexes: [0, 1]
147
- }
1
+ import type {
2
+ MultiGridLegendParams,
3
+ MultiBarsParams,
4
+ MultiBarStackParams,
5
+ MultiBarsTriangleParams,
6
+ MultiLinesParams,
7
+ MultiLineAreasParams,
8
+ MultiDotsParams,
9
+ MultiGroupAxisParams,
10
+ MultiValueAxisParams,
11
+ MultiValueStackAxisParams,
12
+ OverlappingValueAxesParams
13
+ } from './types'
14
+
15
+ export const DEFAULT_MULTI_GRID_LEGEND_PARAMS: MultiGridLegendParams = {
16
+ position: 'right',
17
+ justify: 'end',
18
+ padding: 28,
19
+ backgroundFill: 'none',
20
+ backgroundStroke: 'none',
21
+ gap: 10,
22
+ listRectWidth: 14,
23
+ listRectHeight: 14,
24
+ listRectRadius: 0,
25
+ gridList: [
26
+ {
27
+ listRectWidth: 14,
28
+ listRectHeight: 14,
29
+ listRectRadius: 0,
30
+ }
31
+ ],
32
+ textColorType: 'primary'
33
+ }
34
+
35
+ export const DEFAULT_MULTI_GROUP_AXIS_PARAMS: MultiGroupAxisParams = {
36
+ // labelAnchor: 'start',
37
+ labelOffset: [0, 0],
38
+ labelColorType: 'primary',
39
+ axisLineVisible: true,
40
+ axisLineColorType: 'primary',
41
+ tickFormat: text => text,
42
+ tickLineVisible: true,
43
+ tickPadding: 20,
44
+ tickFullLine: false,
45
+ tickFullLineDasharray: 'none',
46
+ tickColorType: 'secondary',
47
+ tickTextRotate: 0,
48
+ tickTextColorType: 'primary',
49
+ gridIndexes: [0]
50
+ }
51
+
52
+ export const DEFAULT_MULTI_VALUE_AXIS_PARAMS: MultiValueAxisParams = {
53
+ // labelAnchor: 'end',
54
+ labelOffset: [0, 0],
55
+ labelColorType: 'primary',
56
+ axisLineVisible: false,
57
+ axisLineColorType: 'primary',
58
+ ticks: 4,
59
+ tickFormat: ',.0f',
60
+ tickLineVisible: true,
61
+ tickPadding: 20,
62
+ tickFullLine: true,
63
+ tickFullLineDasharray: 'none',
64
+ tickColorType: 'secondary',
65
+ tickTextRotate: 0,
66
+ tickTextColorType: 'primary',
67
+ gridIndexes: [0]
68
+ }
69
+
70
+ export const DEFAULT_MULTI_VALUE_STACK_AXIS_PARAMS: MultiValueStackAxisParams = {
71
+ ...DEFAULT_MULTI_VALUE_AXIS_PARAMS
72
+ }
73
+
74
+ export const DEFAULT_MULTI_BARS_PARAMS: MultiBarsParams = {
75
+ barWidth: 0,
76
+ barPadding: 1,
77
+ barGroupPadding: 40,
78
+ barRadius: false,
79
+ gridIndexes: [0]
80
+ }
81
+
82
+ export const DEFAULT_MULTI_BAR_STACK_PARAMS: MultiBarStackParams = {
83
+ barWidth: 0,
84
+ barGroupPadding: 10,
85
+ barRadius: false,
86
+ gridIndexes: [0]
87
+ }
88
+
89
+ export const DEFAULT_MULTI_BARS_TRIANGLE_PARAMS: MultiBarsTriangleParams = {
90
+ barWidth: 0,
91
+ barPadding: 1,
92
+ barGroupPadding: 20,
93
+ linearGradientOpacity: [1, 0],
94
+ gridIndexes: [0]
95
+ }
96
+
97
+ export const DEFAULT_MULTI_LINES_PARAMS: MultiLinesParams = {
98
+ lineCurve: 'curveLinear',
99
+ lineWidth: 2,
100
+ gridIndexes: [1]
101
+ }
102
+
103
+ export const DEFAULT_MULTI_LINE_AREAS_PARAMS: MultiLineAreasParams = {
104
+ lineCurve: 'curveLinear',
105
+ linearGradientOpacity: [1, 0],
106
+ gridIndexes: [1]
107
+ }
108
+
109
+ export const DEFAULT_MULTI_DOTS_PARAMS: MultiDotsParams = {
110
+ radius: 4,
111
+ fillColorType: 'white',
112
+ strokeColorType: 'series',
113
+ strokeWidth: 2,
114
+ onlyShowHighlighted: false,
115
+ gridIndexes: [1]
116
+ }
117
+
118
+ export const DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS: OverlappingValueAxesParams = {
119
+ firstAxis: {
120
+ // labelAnchor: 'end',
121
+ labelOffset: [0, 0],
122
+ labelColorType: 'primary',
123
+ axisLineVisible: false,
124
+ axisLineColorType: 'primary',
125
+ ticks: 4,
126
+ tickFormat: ',.0f',
127
+ tickLineVisible: true,
128
+ tickPadding: 20,
129
+ tickFullLine: true,
130
+ tickFullLineDasharray: 'none',
131
+ tickColorType: 'secondary',
132
+ tickTextRotate: 0,
133
+ tickTextColorType: 'primary',
134
+ },
135
+ secondAxis: {
136
+ // labelAnchor: 'end',
137
+ labelOffset: [0, 0],
138
+ labelColorType: 'primary',
139
+ axisLineVisible: false,
140
+ axisLineColorType: 'primary',
141
+ ticks: 4,
142
+ tickFormat: ',.0f',
143
+ tickLineVisible: true,
144
+ tickPadding: 20,
145
+ tickFullLine: true,
146
+ tickFullLineDasharray: 'none',
147
+ tickColorType: 'secondary',
148
+ tickTextRotate: 0,
149
+ tickTextColorType: 'primary',
150
+ },
151
+ gridIndexes: [0, 1]
152
+ }
@@ -1,12 +1,14 @@
1
- export * from './defaults'
2
- export * from './types'
3
- export { MultiGridLegend } from './plugins/MultiGridLegend'
4
- export { MultiBars } from './plugins/MultiBars'
5
- export { MultiBarStack } from './plugins/MultiBarStack'
6
- export { MultiBarsTriangle } from './plugins/MultiBarsTriangle'
7
- export { MultiLines } from './plugins/MultiLines'
8
- export { MultiLineAreas } from './plugins/MultiLineAreas'
9
- export { MultiDots } from './plugins/MultiDots'
10
- export { MultiGroupAxis } from './plugins/MultiGroupAxis'
11
- export { MultiValueAxis } from './plugins/MultiValueAxis'
12
- export { OverlappingValueAxes } from './plugins/OverlappingValueAxes'
1
+ export * from './defaults'
2
+ export * from './types'
3
+ export { MultiGridLegend } from './plugins/MultiGridLegend'
4
+ export { MultiBars } from './plugins/MultiBars'
5
+ export { MultiBarStack } from './plugins/MultiBarStack'
6
+ export { MultiBarsTriangle } from './plugins/MultiBarsTriangle'
7
+ export { MultiLines } from './plugins/MultiLines'
8
+ export { MultiLineAreas } from './plugins/MultiLineAreas'
9
+ export { MultiDots } from './plugins/MultiDots'
10
+ export { MultiGroupAxis } from './plugins/MultiGroupAxis'
11
+ export { MultiValueAxis } from './plugins/MultiValueAxis'
12
+ export { MultiValueStackAxis } from './plugins/MultiValueStackAxis'
13
+ export { OverlappingValueAxes } from './plugins/OverlappingValueAxes'
14
+ export { OverlappingValueStackAxes } from './plugins/OverlappingValueStackAxes'
@@ -1,43 +1,44 @@
1
- import type { Observable } from 'rxjs'
2
- import {
3
- Subject,
4
- takeUntil,
5
- of,
6
- map,
7
- reduce,
8
- switchMap,
9
- combineLatest,
10
- distinctUntilChanged,
11
- shareReplay
12
- } from 'rxjs'
13
- import type {
14
- ContextObserverMultiGrid,
15
- ComputedDataGrid,
16
- DataFormatterGrid,
17
- ContextObserverGridDetail,
18
- ContextObserverMultiGridDetail } from '@orbcharts/core'
19
-
20
- // 可設定多個gridIndex的params
21
- interface MultiGridPluginParams {
22
- gridIndexes: number[]
23
- }
24
-
25
- // 對應grid資料的plugin所需Observable(必須有gridIndexes)
26
- export const multiGridPluginObservables = (observer: ContextObserverMultiGrid<MultiGridPluginParams>): Observable<ContextObserverMultiGridDetail[]> => {
27
- const gridIndexes$ = observer.fullParams$.pipe(
28
- map(fullParams => fullParams.gridIndexes),
29
- distinctUntilChanged(),
30
- shareReplay(1)
31
- )
32
-
33
- return combineLatest({
34
- multiGridEachDetail: observer.multiGridEachDetail$,
35
- gridIndexes: gridIndexes$,
36
- }).pipe(
37
- map(data => {
38
- return data.gridIndexes.map(gridIndex => {
39
- return data.multiGridEachDetail[gridIndex] ?? data.multiGridEachDetail[0]
40
- })
41
- })
42
- )
43
- }
1
+ import type { Observable } from 'rxjs'
2
+ import {
3
+ Subject,
4
+ takeUntil,
5
+ of,
6
+ map,
7
+ reduce,
8
+ switchMap,
9
+ combineLatest,
10
+ distinctUntilChanged,
11
+ shareReplay
12
+ } from 'rxjs'
13
+ import type {
14
+ ContextObserverMultiGrid,
15
+ ComputedDataGrid,
16
+ DataFormatterGrid,
17
+ ContextObserverGridDetail,
18
+ ContextObserverMultiGridDetail } from '@orbcharts/core'
19
+
20
+ // 可設定多個gridIndex的params
21
+ interface MultiGridPluginParams {
22
+ gridIndexes: number[]
23
+ }
24
+
25
+ // 對應grid資料的plugin所需Observable(必須有gridIndexes)
26
+ export const multiGridPluginDetailObservables = (observer: ContextObserverMultiGrid<MultiGridPluginParams>): Observable<ContextObserverMultiGridDetail[]> => {
27
+ const gridIndexes$ = observer.fullParams$.pipe(
28
+ map(fullParams => fullParams.gridIndexes),
29
+ distinctUntilChanged(),
30
+ shareReplay(1)
31
+ )
32
+
33
+ return combineLatest({
34
+ multiGridEachDetail: observer.multiGridEachDetail$,
35
+ gridIndexes: gridIndexes$,
36
+ }).pipe(
37
+ map(data => {
38
+ return data.gridIndexes.map(gridIndex => {
39
+ return data.multiGridEachDetail[gridIndex] ?? data.multiGridEachDetail[0]
40
+ })
41
+ })
42
+ )
43
+ }
44
+
@@ -1,78 +1,78 @@
1
- import * as d3 from 'd3'
2
- import {
3
- Subject,
4
- map,
5
- distinctUntilChanged,
6
- shareReplay,
7
- takeUntil
8
- } from 'rxjs'
9
- import {
10
- defineMultiGridPlugin } from '@orbcharts/core'
11
- import { DEFAULT_MULTI_BAR_STACK_PARAMS } from '../defaults'
12
- import { createBaseBarStack } from '../../base/BaseBarStack'
13
- import { multiGridPluginObservables } from '../multiGridObservables'
14
- import { getClassName, getUniID } from '../../utils/orbchartsUtils'
15
-
16
- const pluginName = 'MultiBarStack'
17
-
18
- const gridClassName = getClassName(pluginName, 'grid')
19
-
20
- export const MultiBarStack = defineMultiGridPlugin(pluginName, DEFAULT_MULTI_BAR_STACK_PARAMS)(({ selection, name, subject, observer }) => {
21
- const destroy$ = new Subject()
22
-
23
- const unsubscribeFnArr: (() => void)[] = []
24
-
25
- const multiGridPlugin$ = multiGridPluginObservables(observer)
26
-
27
- multiGridPlugin$
28
- .pipe(
29
- takeUntil(destroy$)
30
- )
31
- .subscribe(data => {
32
- // 每次重新計算時,清除之前的訂閱
33
- unsubscribeFnArr.forEach(fn => fn())
34
-
35
- selection.selectAll(`g.${gridClassName}`)
36
- .data(data)
37
- .join('g')
38
- .attr('class', gridClassName)
39
- .each((d, i, g) => {
40
-
41
- const gridSelection = d3.select(g[i])
42
-
43
- const isSeriesSeprate$ = d.dataFormatter$.pipe(
44
- takeUntil(destroy$),
45
- map(d => d.grid.separateSeries),
46
- distinctUntilChanged(),
47
- shareReplay(1)
48
- )
49
-
50
- unsubscribeFnArr[i] = createBaseBarStack(pluginName, {
51
- selection: gridSelection,
52
- computedData$: d.computedData$,
53
- visibleComputedData$: d.visibleComputedData$,
54
- computedLayoutData$: d.computedLayoutData$,
55
- visibleComputedLayoutData$: d.visibleComputedLayoutData$,
56
- seriesLabels$: d.seriesLabels$,
57
- SeriesDataMap$: d.SeriesDataMap$,
58
- GroupDataMap$: d.GroupDataMap$,
59
- fullParams$: observer.fullParams$,
60
- fullDataFormatter$: d.dataFormatter$,
61
- fullChartParams$: observer.fullChartParams$,
62
- gridAxesTransform$: d.gridAxesTransform$,
63
- gridGraphicTransform$: d.gridGraphicTransform$,
64
- gridGraphicReverseScale$: d.gridGraphicReverseScale$,
65
- gridAxesSize$: d.gridAxesSize$,
66
- gridHighlight$: d.gridHighlight$,
67
- gridContainerPosition$: d.gridContainerPosition$,
68
- isSeriesSeprate$,
69
- event$: subject.event$ as Subject<any>,
70
- })
71
- })
72
- })
73
-
74
- return () => {
75
- destroy$.next(undefined)
76
- unsubscribeFnArr.forEach(fn => fn())
77
- }
78
- })
1
+ import * as d3 from 'd3'
2
+ import {
3
+ Subject,
4
+ map,
5
+ distinctUntilChanged,
6
+ shareReplay,
7
+ takeUntil
8
+ } from 'rxjs'
9
+ import {
10
+ defineMultiGridPlugin } from '@orbcharts/core'
11
+ import { DEFAULT_MULTI_BAR_STACK_PARAMS } from '../defaults'
12
+ import { createBaseBarStack } from '../../base/BaseBarStack'
13
+ import { multiGridPluginDetailObservables } from '../multiGridObservables'
14
+ import { getClassName, getUniID } from '../../utils/orbchartsUtils'
15
+
16
+ const pluginName = 'MultiBarStack'
17
+
18
+ const gridClassName = getClassName(pluginName, 'grid')
19
+
20
+ export const MultiBarStack = defineMultiGridPlugin(pluginName, DEFAULT_MULTI_BAR_STACK_PARAMS)(({ selection, name, subject, observer }) => {
21
+ const destroy$ = new Subject()
22
+
23
+ const unsubscribeFnArr: (() => void)[] = []
24
+
25
+ const multiGridPluginDetail$ = multiGridPluginDetailObservables(observer)
26
+
27
+ multiGridPluginDetail$
28
+ .pipe(
29
+ takeUntil(destroy$)
30
+ )
31
+ .subscribe(data => {
32
+ // 每次重新計算時,清除之前的訂閱
33
+ unsubscribeFnArr.forEach(fn => fn())
34
+
35
+ selection.selectAll(`g.${gridClassName}`)
36
+ .data(data)
37
+ .join('g')
38
+ .attr('class', gridClassName)
39
+ .each((d, i, g) => {
40
+
41
+ const gridSelection = d3.select(g[i])
42
+
43
+ const isSeriesSeprate$ = d.dataFormatter$.pipe(
44
+ takeUntil(destroy$),
45
+ map(d => d.grid.separateSeries),
46
+ distinctUntilChanged(),
47
+ shareReplay(1)
48
+ )
49
+
50
+ unsubscribeFnArr[i] = createBaseBarStack(pluginName, {
51
+ selection: gridSelection,
52
+ computedData$: d.computedData$,
53
+ visibleComputedData$: d.visibleComputedData$,
54
+ computedLayoutData$: d.computedLayoutData$,
55
+ visibleComputedLayoutData$: d.visibleComputedLayoutData$,
56
+ seriesLabels$: d.seriesLabels$,
57
+ SeriesDataMap$: d.SeriesDataMap$,
58
+ GroupDataMap$: d.GroupDataMap$,
59
+ fullParams$: observer.fullParams$,
60
+ fullDataFormatter$: d.dataFormatter$,
61
+ fullChartParams$: observer.fullChartParams$,
62
+ gridAxesTransform$: d.gridAxesTransform$,
63
+ gridGraphicTransform$: d.gridGraphicTransform$,
64
+ gridGraphicReverseScale$: d.gridGraphicReverseScale$,
65
+ gridAxesSize$: d.gridAxesSize$,
66
+ gridHighlight$: d.gridHighlight$,
67
+ gridContainerPosition$: d.gridContainerPosition$,
68
+ isSeriesSeprate$,
69
+ event$: subject.event$ as Subject<any>,
70
+ })
71
+ })
72
+ })
73
+
74
+ return () => {
75
+ destroy$.next(undefined)
76
+ unsubscribeFnArr.forEach(fn => fn())
77
+ }
78
+ })