@orbcharts/plugins-basic 3.0.0-alpha.41 → 3.0.0-alpha.43

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 (84) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-plugins-basic.es.js +5477 -5426
  3. package/dist/orbcharts-plugins-basic.umd.js +8 -8
  4. package/dist/src/base/BaseBarStack.d.ts +1 -1
  5. package/dist/src/base/BaseBars.d.ts +1 -1
  6. package/dist/src/base/BaseBarsTriangle.d.ts +1 -1
  7. package/dist/src/base/BaseDots.d.ts +1 -1
  8. package/dist/src/base/BaseLineAreas.d.ts +1 -1
  9. package/dist/src/base/BaseLines.d.ts +1 -1
  10. package/dist/src/multiGrid/defaults.d.ts +2 -1
  11. package/dist/src/multiGrid/index.d.ts +1 -0
  12. package/dist/src/multiGrid/plugins/MultiLineAreas.d.ts +1 -0
  13. package/dist/src/multiGrid/types.d.ts +4 -4
  14. package/package.json +42 -42
  15. package/src/base/BaseBarStack.ts +881 -879
  16. package/src/base/BaseBars.ts +750 -748
  17. package/src/base/BaseBarsTriangle.ts +659 -657
  18. package/src/base/BaseDots.ts +639 -637
  19. package/src/base/BaseGroupAxis.ts +496 -496
  20. package/src/base/BaseLegend.ts +636 -636
  21. package/src/base/BaseLineAreas.ts +621 -624
  22. package/src/base/BaseLines.ts +692 -695
  23. package/src/base/BaseValueAxis.ts +479 -479
  24. package/src/base/types.ts +2 -2
  25. package/src/grid/defaults.ts +121 -121
  26. package/src/grid/gridObservables.ts +263 -263
  27. package/src/grid/index.ts +15 -15
  28. package/src/grid/plugins/BarStack.ts +37 -37
  29. package/src/grid/plugins/Bars.ts +37 -37
  30. package/src/grid/plugins/BarsDiverging.ts +39 -39
  31. package/src/grid/plugins/BarsTriangle.ts +34 -34
  32. package/src/grid/plugins/Dots.ts +35 -35
  33. package/src/grid/plugins/GridLegend.ts +58 -58
  34. package/src/grid/plugins/GroupAux.ts +643 -643
  35. package/src/grid/plugins/GroupAxis.ts +30 -30
  36. package/src/grid/plugins/LineAreas.ts +36 -36
  37. package/src/grid/plugins/Lines.ts +35 -35
  38. package/src/grid/plugins/ScalingArea.ts +174 -174
  39. package/src/grid/plugins/ValueAxis.ts +31 -31
  40. package/src/grid/plugins/ValueStackAxis.ts +70 -70
  41. package/src/grid/types.ts +120 -120
  42. package/src/index.ts +9 -9
  43. package/src/multiGrid/defaults.ts +147 -140
  44. package/src/multiGrid/index.ts +11 -10
  45. package/src/multiGrid/multiGridObservables.ts +289 -278
  46. package/src/multiGrid/plugins/MultiBarStack.ts +60 -60
  47. package/src/multiGrid/plugins/MultiBars.ts +59 -59
  48. package/src/multiGrid/plugins/MultiBarsTriangle.ts +58 -58
  49. package/src/multiGrid/plugins/MultiDots.ts +58 -58
  50. package/src/multiGrid/plugins/MultiGridLegend.ts +88 -88
  51. package/src/multiGrid/plugins/MultiGroupAxis.ts +53 -53
  52. package/src/multiGrid/plugins/MultiLineAreas.ts +59 -0
  53. package/src/multiGrid/plugins/MultiLines.ts +58 -58
  54. package/src/multiGrid/plugins/MultiValueAxis.ts +53 -53
  55. package/src/multiGrid/plugins/OverlappingValueAxes.ts +164 -165
  56. package/src/multiGrid/types.ts +67 -67
  57. package/src/noneData/defaults.ts +61 -61
  58. package/src/noneData/index.ts +3 -3
  59. package/src/noneData/plugins/Container.ts +10 -10
  60. package/src/noneData/plugins/Tooltip.ts +304 -304
  61. package/src/noneData/types.ts +26 -26
  62. package/src/series/defaults.ts +99 -99
  63. package/src/series/index.ts +6 -6
  64. package/src/series/plugins/Bubbles.ts +551 -549
  65. package/src/series/plugins/Pie.ts +600 -598
  66. package/src/series/plugins/PieEventTexts.ts +194 -194
  67. package/src/series/plugins/PieLabels.ts +288 -285
  68. package/src/series/plugins/SeriesLegend.ts +58 -58
  69. package/src/series/seriesUtils.ts +50 -50
  70. package/src/series/types.ts +67 -67
  71. package/src/tree/defaults.ts +22 -22
  72. package/src/tree/index.ts +3 -3
  73. package/src/tree/plugins/TreeLegend.ts +58 -58
  74. package/src/tree/plugins/TreeMap.ts +302 -300
  75. package/src/tree/types.ts +23 -23
  76. package/src/utils/commonUtils.ts +21 -21
  77. package/src/utils/d3Graphics.ts +124 -124
  78. package/src/utils/d3Utils.ts +73 -73
  79. package/src/utils/observables.ts +14 -14
  80. package/src/utils/orbchartsUtils.ts +100 -100
  81. package/tsconfig.dev.json +16 -16
  82. package/tsconfig.json +13 -13
  83. package/tsconfig.prod.json +13 -13
  84. package/vite.config.js +49 -49
@@ -1,71 +1,71 @@
1
- import {
2
- takeUntil,
3
- map,
4
- switchMap,
5
- iif,
6
- Subject } from 'rxjs'
7
- import {
8
- defineGridPlugin } from '@orbcharts/core'
9
- import { DEFAULT_VALUE_STACK_AXIS_PARAMS } from '../defaults'
10
-
11
- import { createBaseValueAxis } from '../../base/BaseValueAxis'
12
-
13
- const pluginName = 'ValueStackAxis'
14
-
15
- export const ValueStackAxis = defineGridPlugin(pluginName, DEFAULT_VALUE_STACK_AXIS_PARAMS)(({ selection, name, observer, subject }) => {
16
-
17
- const destroy$ = new Subject()
18
-
19
- // 將原本的value全部替換成加總後的value
20
- const stackedData$ = observer.computedData$.pipe(
21
- takeUntil(destroy$),
22
- map(data => {
23
- // 將同一group的value加總起來
24
- const stackedValue = new Array(data[0] ? data[0].length : 0)
25
- .fill(null)
26
- .map((_, i) => {
27
- return data.reduce((prev, current) => {
28
- if (current && current[i]) {
29
- const currentValue = current[i].value == null || current[i].visible == false
30
- ? 0
31
- : current[i].value!
32
- return prev + currentValue
33
- }
34
- return prev
35
- }, 0)
36
- })
37
- // 將原本的value全部替換成加總後的value
38
- const computedData = data.map((series, seriesIndex) => {
39
- return series.map((d, i) => {
40
- return {
41
- ...d,
42
- value: stackedValue[i],
43
- }
44
- })
45
- })
46
- return computedData
47
- }),
48
- )
49
-
50
- const unsubscribeBaseValueAxis = createBaseValueAxis(pluginName, {
51
- selection,
52
- computedData$: observer.isSeriesPositionSeprate$.pipe(
53
- switchMap(isSeriesPositionSeprate => {
54
- return iif(() => isSeriesPositionSeprate, observer.computedData$, stackedData$)
55
- })
56
- ),
57
- fullParams$: observer.fullParams$,
58
- fullDataFormatter$: observer.fullDataFormatter$,
59
- fullChartParams$: observer.fullChartParams$,
60
- gridAxesTransform$: observer.gridAxesTransform$,
61
- gridAxesReverseTransform$: observer.gridAxesReverseTransform$,
62
- gridAxesSize$: observer.gridAxesSize$,
63
- gridContainer$: observer.gridContainer$,
64
- isSeriesPositionSeprate$: observer.isSeriesPositionSeprate$,
65
- })
66
-
67
- return () => {
68
- destroy$.next(undefined)
69
- unsubscribeBaseValueAxis()
70
- }
1
+ import {
2
+ takeUntil,
3
+ map,
4
+ switchMap,
5
+ iif,
6
+ Subject } from 'rxjs'
7
+ import {
8
+ defineGridPlugin } from '@orbcharts/core'
9
+ import { DEFAULT_VALUE_STACK_AXIS_PARAMS } from '../defaults'
10
+
11
+ import { createBaseValueAxis } from '../../base/BaseValueAxis'
12
+
13
+ const pluginName = 'ValueStackAxis'
14
+
15
+ export const ValueStackAxis = defineGridPlugin(pluginName, DEFAULT_VALUE_STACK_AXIS_PARAMS)(({ selection, name, observer, subject }) => {
16
+
17
+ const destroy$ = new Subject()
18
+
19
+ // 將原本的value全部替換成加總後的value
20
+ const stackedData$ = observer.computedData$.pipe(
21
+ takeUntil(destroy$),
22
+ map(data => {
23
+ // 將同一group的value加總起來
24
+ const stackedValue = new Array(data[0] ? data[0].length : 0)
25
+ .fill(null)
26
+ .map((_, i) => {
27
+ return data.reduce((prev, current) => {
28
+ if (current && current[i]) {
29
+ const currentValue = current[i].value == null || current[i].visible == false
30
+ ? 0
31
+ : current[i].value!
32
+ return prev + currentValue
33
+ }
34
+ return prev
35
+ }, 0)
36
+ })
37
+ // 將原本的value全部替換成加總後的value
38
+ const computedData = data.map((series, seriesIndex) => {
39
+ return series.map((d, i) => {
40
+ return {
41
+ ...d,
42
+ value: stackedValue[i],
43
+ }
44
+ })
45
+ })
46
+ return computedData
47
+ }),
48
+ )
49
+
50
+ const unsubscribeBaseValueAxis = createBaseValueAxis(pluginName, {
51
+ selection,
52
+ computedData$: observer.isSeriesPositionSeprate$.pipe(
53
+ switchMap(isSeriesPositionSeprate => {
54
+ return iif(() => isSeriesPositionSeprate, observer.computedData$, stackedData$)
55
+ })
56
+ ),
57
+ fullParams$: observer.fullParams$,
58
+ fullDataFormatter$: observer.fullDataFormatter$,
59
+ fullChartParams$: observer.fullChartParams$,
60
+ gridAxesTransform$: observer.gridAxesTransform$,
61
+ gridAxesReverseTransform$: observer.gridAxesReverseTransform$,
62
+ gridAxesSize$: observer.gridAxesSize$,
63
+ gridContainer$: observer.gridContainer$,
64
+ isSeriesPositionSeprate$: observer.isSeriesPositionSeprate$,
65
+ })
66
+
67
+ return () => {
68
+ destroy$.next(undefined)
69
+ unsubscribeBaseValueAxis()
70
+ }
71
71
  })
package/src/grid/types.ts CHANGED
@@ -1,121 +1,121 @@
1
- import type { ColorType } from '@orbcharts/core'
2
- // import type { BaseLegendParams } from '../base/BaseLegend'
3
-
4
- // export type LineType = 'line' | 'area' | 'gradientArea'
5
- // export type BarType = 'rect' | 'triangle'
6
-
7
- export interface LinesParams {
8
- lineCurve: string
9
- lineWidth: number
10
- // labelFn: (d: ComputedDatumSeries) => string
11
- // labelPositionFn: (d: ComputedDatumSeries) => 'top' | 'bottom' | 'left' | 'right' | 'center'
12
- // labelStyleFn: (d: ComputedDatumSeries) => string
13
- // labelFontSizeFn: (d: ComputedDatumSeries) => number
14
- // labelColorFn: (d: ComputedDatumSeries) => string
15
- // labelPadding: number
16
- }
17
-
18
- export interface LineAreasParams {
19
- lineCurve: string
20
- linearGradientOpacity: [number, number]
21
- }
22
-
23
- export interface DotsParams {
24
- radius: number
25
- fillColorType: ColorType
26
- strokeColorType: ColorType
27
- strokeWidth: number
28
- onlyShowHighlighted: boolean
29
- }
30
-
31
- export interface GroupAuxParams {
32
- showLine: boolean
33
- showLabel: boolean
34
- lineDashArray: string
35
- lineColorType: ColorType
36
- labelColorType: ColorType
37
- labelTextColorType: ColorType
38
- labelTextFormat: string | ((text: any) => string)
39
- labelPadding: number
40
- }
41
-
42
- export interface BarsParams {
43
- // barType: BarType
44
- barWidth: number
45
- barPadding: number
46
- barGroupPadding: number // 群組和群組間的間隔
47
- barRadius: number | boolean
48
- }
49
-
50
- export interface BarsDivergingParams extends BarsParams {}
51
-
52
- export interface BarStackParams {
53
- barWidth: number
54
- barGroupPadding: number
55
- barRadius: number | boolean
56
- }
57
-
58
- export interface BarsTriangleParams {
59
- barWidth: number
60
- barPadding: number
61
- barGroupPadding: number // 群組和群組間的間隔
62
- linearGradientOpacity: [number, number]
63
- }
64
-
65
- export interface GroupAxisParams {
66
- // xLabel: string
67
- // labelAnchor: 'start' | 'end'
68
- labelOffset: [number, number]
69
- labelColorType: ColorType
70
- axisLineVisible: boolean
71
- axisLineColorType: ColorType
72
- tickFormat: string | ((text: any) => string)
73
- tickLineVisible: boolean
74
- tickPadding: number
75
- tickFullLine: boolean
76
- tickFullLineDasharray: string
77
- tickColorType: ColorType
78
- // axisLineColor: string
79
- // axisLabelColor: string
80
- tickTextRotate: number
81
- tickTextColorType: ColorType
82
- }
83
-
84
- export interface ValueAxisParams {
85
- // xLabel: string
86
- // labelAnchor: 'start' | 'end'
87
- labelOffset: [number, number]
88
- labelColorType: ColorType
89
- axisLineVisible: boolean
90
- axisLineColorType: ColorType
91
- ticks: number
92
- tickFormat: string | ((text: d3.NumberValue) => string)
93
- tickLineVisible: boolean
94
- tickPadding: number
95
- tickFullLine: boolean
96
- tickFullLineDasharray: string
97
- tickColorType: ColorType
98
- // axisLineColor: string
99
- // axisLabelColor: string
100
- tickTextRotate: number
101
- tickTextColorType: ColorType
102
- }
103
-
104
- export interface ValueStackAxisParams extends ValueAxisParams {}
105
-
106
- export interface ScalingAreaParams {
107
-
108
- }
109
-
110
- export interface GridLegendParams {
111
- position: 'top' | 'bottom' | 'left' | 'right'
112
- justify: 'start' | 'center' | 'end'
113
- padding: number
114
- backgroundFill: ColorType
115
- backgroundStroke: ColorType
116
- gap: number
117
- listRectWidth: number
118
- listRectHeight: number
119
- listRectRadius: number
120
- textColorType: ColorType
1
+ import type { ColorType } from '@orbcharts/core'
2
+ // import type { BaseLegendParams } from '../base/BaseLegend'
3
+
4
+ // export type LineType = 'line' | 'area' | 'gradientArea'
5
+ // export type BarType = 'rect' | 'triangle'
6
+
7
+ export interface LinesParams {
8
+ lineCurve: string
9
+ lineWidth: number
10
+ // labelFn: (d: ComputedDatumSeries) => string
11
+ // labelPositionFn: (d: ComputedDatumSeries) => 'top' | 'bottom' | 'left' | 'right' | 'center'
12
+ // labelStyleFn: (d: ComputedDatumSeries) => string
13
+ // labelFontSizeFn: (d: ComputedDatumSeries) => number
14
+ // labelColorFn: (d: ComputedDatumSeries) => string
15
+ // labelPadding: number
16
+ }
17
+
18
+ export interface LineAreasParams {
19
+ lineCurve: string
20
+ linearGradientOpacity: [number, number]
21
+ }
22
+
23
+ export interface DotsParams {
24
+ radius: number
25
+ fillColorType: ColorType
26
+ strokeColorType: ColorType
27
+ strokeWidth: number
28
+ onlyShowHighlighted: boolean
29
+ }
30
+
31
+ export interface GroupAuxParams {
32
+ showLine: boolean
33
+ showLabel: boolean
34
+ lineDashArray: string
35
+ lineColorType: ColorType
36
+ labelColorType: ColorType
37
+ labelTextColorType: ColorType
38
+ labelTextFormat: string | ((text: any) => string)
39
+ labelPadding: number
40
+ }
41
+
42
+ export interface BarsParams {
43
+ // barType: BarType
44
+ barWidth: number
45
+ barPadding: number
46
+ barGroupPadding: number // 群組和群組間的間隔
47
+ barRadius: number | boolean
48
+ }
49
+
50
+ export interface BarsDivergingParams extends BarsParams {}
51
+
52
+ export interface BarStackParams {
53
+ barWidth: number
54
+ barGroupPadding: number
55
+ barRadius: number | boolean
56
+ }
57
+
58
+ export interface BarsTriangleParams {
59
+ barWidth: number
60
+ barPadding: number
61
+ barGroupPadding: number // 群組和群組間的間隔
62
+ linearGradientOpacity: [number, number]
63
+ }
64
+
65
+ export interface GroupAxisParams {
66
+ // xLabel: string
67
+ // labelAnchor: 'start' | 'end'
68
+ labelOffset: [number, number]
69
+ labelColorType: ColorType
70
+ axisLineVisible: boolean
71
+ axisLineColorType: ColorType
72
+ tickFormat: string | ((text: any) => string)
73
+ tickLineVisible: boolean
74
+ tickPadding: number
75
+ tickFullLine: boolean
76
+ tickFullLineDasharray: string
77
+ tickColorType: ColorType
78
+ // axisLineColor: string
79
+ // axisLabelColor: string
80
+ tickTextRotate: number
81
+ tickTextColorType: ColorType
82
+ }
83
+
84
+ export interface ValueAxisParams {
85
+ // xLabel: string
86
+ // labelAnchor: 'start' | 'end'
87
+ labelOffset: [number, number]
88
+ labelColorType: ColorType
89
+ axisLineVisible: boolean
90
+ axisLineColorType: ColorType
91
+ ticks: number
92
+ tickFormat: string | ((text: d3.NumberValue) => string)
93
+ tickLineVisible: boolean
94
+ tickPadding: number
95
+ tickFullLine: boolean
96
+ tickFullLineDasharray: string
97
+ tickColorType: ColorType
98
+ // axisLineColor: string
99
+ // axisLabelColor: string
100
+ tickTextRotate: number
101
+ tickTextColorType: ColorType
102
+ }
103
+
104
+ export interface ValueStackAxisParams extends ValueAxisParams {}
105
+
106
+ export interface ScalingAreaParams {
107
+
108
+ }
109
+
110
+ export interface GridLegendParams {
111
+ position: 'top' | 'bottom' | 'left' | 'right'
112
+ justify: 'start' | 'center' | 'end'
113
+ padding: number
114
+ backgroundFill: ColorType
115
+ backgroundStroke: ColorType
116
+ gap: number
117
+ listRectWidth: number
118
+ listRectHeight: number
119
+ listRectRadius: number
120
+ textColorType: ColorType
121
121
  }
package/src/index.ts CHANGED
@@ -1,10 +1,10 @@
1
- // export { default as container } from './noneDataPlugins/container'
2
- // export { default as pie } from './seriesPlugins/pie'
3
- // export { default as pieEventTexts } from './seriesPlugins/pieEventTexts'
4
- // export { default as pieLabels } from './seriesPlugins/pieLabels'
5
-
6
- export * from './grid'
7
- export * from './multiGrid'
8
- export * from './noneData'
9
- export * from './series'
1
+ // export { default as container } from './noneDataPlugins/container'
2
+ // export { default as pie } from './seriesPlugins/pie'
3
+ // export { default as pieEventTexts } from './seriesPlugins/pieEventTexts'
4
+ // export { default as pieLabels } from './seriesPlugins/pieLabels'
5
+
6
+ export * from './grid'
7
+ export * from './multiGrid'
8
+ export * from './noneData'
9
+ export * from './series'
10
10
  export * from './tree'