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

Sign up to get free protection for your applications and to get access to all the features.
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'