@orbcharts/plugins-basic 3.0.0-alpha.68 → 3.0.0-alpha.70

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 (79) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-plugins-basic.es.js +4838 -4760
  3. package/dist/orbcharts-plugins-basic.umd.js +15 -14
  4. package/dist/src/utils/d3Graphics.d.ts +10 -0
  5. package/package.json +42 -42
  6. package/src/base/BaseBarStack.ts +779 -779
  7. package/src/base/BaseBars.ts +764 -764
  8. package/src/base/BaseBarsTriangle.ts +672 -672
  9. package/src/base/BaseDots.ts +513 -513
  10. package/src/base/BaseGroupAxis.ts +675 -652
  11. package/src/base/BaseLegend.ts +642 -642
  12. package/src/base/BaseLineAreas.ts +628 -628
  13. package/src/base/BaseLines.ts +704 -704
  14. package/src/base/BaseValueAxis.ts +578 -578
  15. package/src/base/types.ts +2 -2
  16. package/src/grid/defaults.ts +128 -128
  17. package/src/grid/gridObservables.ts +543 -543
  18. package/src/grid/index.ts +15 -15
  19. package/src/grid/plugins/BarStack.ts +43 -43
  20. package/src/grid/plugins/Bars.ts +44 -44
  21. package/src/grid/plugins/BarsPN.ts +41 -41
  22. package/src/grid/plugins/BarsTriangle.ts +42 -42
  23. package/src/grid/plugins/Dots.ts +37 -37
  24. package/src/grid/plugins/GridLegend.ts +59 -59
  25. package/src/grid/plugins/GroupAux.ts +1014 -991
  26. package/src/grid/plugins/GroupAxis.ts +36 -36
  27. package/src/grid/plugins/LineAreas.ts +40 -40
  28. package/src/grid/plugins/Lines.ts +40 -40
  29. package/src/grid/plugins/ScalingArea.ts +176 -174
  30. package/src/grid/plugins/ValueAxis.ts +36 -36
  31. package/src/grid/plugins/ValueStackAxis.ts +38 -38
  32. package/src/grid/types.ts +123 -123
  33. package/src/index.ts +9 -9
  34. package/src/multiGrid/defaults.ts +158 -158
  35. package/src/multiGrid/index.ts +13 -13
  36. package/src/multiGrid/multiGridObservables.ts +49 -49
  37. package/src/multiGrid/plugins/MultiBarStack.ts +78 -78
  38. package/src/multiGrid/plugins/MultiBars.ts +77 -77
  39. package/src/multiGrid/plugins/MultiBarsTriangle.ts +77 -77
  40. package/src/multiGrid/plugins/MultiDots.ts +65 -65
  41. package/src/multiGrid/plugins/MultiGridLegend.ts +89 -89
  42. package/src/multiGrid/plugins/MultiGroupAxis.ts +70 -70
  43. package/src/multiGrid/plugins/MultiLineAreas.ts +77 -77
  44. package/src/multiGrid/plugins/MultiLines.ts +77 -77
  45. package/src/multiGrid/plugins/MultiValueAxis.ts +69 -69
  46. package/src/multiGrid/plugins/MultiValueStackAxis.ts +69 -69
  47. package/src/multiGrid/plugins/OverlappingValueAxes.ts +170 -170
  48. package/src/multiGrid/plugins/OverlappingValueStackAxes.ts +169 -169
  49. package/src/multiGrid/types.ts +72 -72
  50. package/src/noneData/defaults.ts +102 -102
  51. package/src/noneData/index.ts +3 -3
  52. package/src/noneData/plugins/Container.ts +10 -10
  53. package/src/noneData/plugins/Tooltip.ts +327 -327
  54. package/src/noneData/types.ts +26 -26
  55. package/src/series/defaults.ts +149 -149
  56. package/src/series/index.ts +9 -9
  57. package/src/series/plugins/Bubbles.ts +545 -545
  58. package/src/series/plugins/Pie.ts +584 -584
  59. package/src/series/plugins/PieEventTexts.ts +262 -262
  60. package/src/series/plugins/PieLabels.ts +604 -598
  61. package/src/series/plugins/Rose.ts +481 -481
  62. package/src/series/plugins/RoseLabels.ts +571 -565
  63. package/src/series/plugins/SeriesLegend.ts +59 -59
  64. package/src/series/seriesObservables.ts +145 -145
  65. package/src/series/seriesUtils.ts +51 -51
  66. package/src/series/types.ts +87 -87
  67. package/src/tree/defaults.ts +23 -23
  68. package/src/tree/index.ts +3 -3
  69. package/src/tree/plugins/TreeLegend.ts +59 -59
  70. package/src/tree/plugins/TreeMap.ts +305 -305
  71. package/src/tree/types.ts +23 -23
  72. package/src/utils/commonUtils.ts +21 -21
  73. package/src/utils/d3Graphics.ts +174 -124
  74. package/src/utils/d3Utils.ts +73 -73
  75. package/src/utils/observables.ts +14 -14
  76. package/src/utils/orbchartsUtils.ts +100 -100
  77. package/tsconfig.base.json +13 -13
  78. package/tsconfig.json +2 -2
  79. package/vite.config.js +22 -22
@@ -1,87 +1,87 @@
1
- import type { ComputedDatumSeries, EventSeries, EventName, ColorType } from '@orbcharts/core'
2
- // import type { BaseLegendParams } from '../base/BaseLegend'
3
-
4
- export type ArcScaleType = 'area' | 'radius'
5
-
6
- export interface BubblesParams {
7
- force: {
8
- strength: number; // 泡泡引力
9
- velocityDecay: number; // 衰減數
10
- collisionSpacing: number // 泡泡間距
11
- }
12
- bubbleText: {
13
- fillRate: number
14
- lineHeight: number
15
- lineLengthMin: number
16
- }
17
- // highlightRIncrease: number
18
- arcScaleType: ArcScaleType
19
- }
20
-
21
- export interface PieParams {
22
- // padding: Padding
23
- outerRadius: number
24
- innerRadius: number
25
- outerRadiusWhileHighlight: number
26
- // label?: LabelStyle
27
- // enterDuration: number
28
- startAngle: number
29
- endAngle: number
30
- padAngle: number
31
- strokeColorType: ColorType
32
- strokeWidth: number
33
- // padRadius: number
34
- cornerRadius: number
35
- }
36
-
37
- export interface PieEventTextsParams {
38
- eventFn: (d: EventSeries, eventName: EventName, t: number) => string[]
39
- textAttrs: Array<{ [key:string]: string | number }>
40
- textStyles: Array<{ [key:string]: string | number }>
41
- }
42
-
43
- export interface PieLabelsParams {
44
- // solidColor?: string;
45
- // colors?: string[];
46
- outerRadius: number
47
- outerRadiusWhileHighlight: number
48
- // innerRadius?: number;
49
- // enterDuration?: number
50
- startAngle: number
51
- endAngle: number
52
- labelCentroid: number
53
- // fontSize?: number
54
- labelFn: ((d: ComputedDatumSeries) => string)
55
- labelColorType: ColorType
56
- }
57
-
58
- export interface RoseParams {
59
- outerRadius: number
60
- padAngle: number
61
- strokeColorType: ColorType
62
- strokeWidth: number
63
- cornerRadius: number
64
- arcScaleType: ArcScaleType
65
- angleIncreaseWhileHighlight: number
66
- }
67
-
68
- export interface RoseLabelsParams {
69
- outerRadius: number
70
- labelCentroid: number
71
- labelFn: ((d: ComputedDatumSeries) => string)
72
- labelColorType: ColorType
73
- arcScaleType: ArcScaleType
74
- }
75
-
76
- export interface SeriesLegendParams {
77
- position: 'top' | 'bottom' | 'left' | 'right'
78
- justify: 'start' | 'center' | 'end'
79
- padding: number
80
- backgroundFill: ColorType
81
- backgroundStroke: ColorType
82
- gap: number
83
- listRectWidth: number
84
- listRectHeight: number
85
- listRectRadius: number
86
- textColorType: ColorType
87
- }
1
+ import type { ComputedDatumSeries, EventSeries, EventName, ColorType } from '@orbcharts/core'
2
+ // import type { BaseLegendParams } from '../base/BaseLegend'
3
+
4
+ export type ArcScaleType = 'area' | 'radius'
5
+
6
+ export interface BubblesParams {
7
+ force: {
8
+ strength: number; // 泡泡引力
9
+ velocityDecay: number; // 衰減數
10
+ collisionSpacing: number // 泡泡間距
11
+ }
12
+ bubbleText: {
13
+ fillRate: number
14
+ lineHeight: number
15
+ lineLengthMin: number
16
+ }
17
+ // highlightRIncrease: number
18
+ arcScaleType: ArcScaleType
19
+ }
20
+
21
+ export interface PieParams {
22
+ // padding: Padding
23
+ outerRadius: number
24
+ innerRadius: number
25
+ outerRadiusWhileHighlight: number
26
+ // label?: LabelStyle
27
+ // enterDuration: number
28
+ startAngle: number
29
+ endAngle: number
30
+ padAngle: number
31
+ strokeColorType: ColorType
32
+ strokeWidth: number
33
+ // padRadius: number
34
+ cornerRadius: number
35
+ }
36
+
37
+ export interface PieEventTextsParams {
38
+ eventFn: (d: EventSeries, eventName: EventName, t: number) => string[]
39
+ textAttrs: Array<{ [key:string]: string | number }>
40
+ textStyles: Array<{ [key:string]: string | number }>
41
+ }
42
+
43
+ export interface PieLabelsParams {
44
+ // solidColor?: string;
45
+ // colors?: string[];
46
+ outerRadius: number
47
+ outerRadiusWhileHighlight: number
48
+ // innerRadius?: number;
49
+ // enterDuration?: number
50
+ startAngle: number
51
+ endAngle: number
52
+ labelCentroid: number
53
+ // fontSize?: number
54
+ labelFn: ((d: ComputedDatumSeries) => string)
55
+ labelColorType: ColorType
56
+ }
57
+
58
+ export interface RoseParams {
59
+ outerRadius: number
60
+ padAngle: number
61
+ strokeColorType: ColorType
62
+ strokeWidth: number
63
+ cornerRadius: number
64
+ arcScaleType: ArcScaleType
65
+ angleIncreaseWhileHighlight: number
66
+ }
67
+
68
+ export interface RoseLabelsParams {
69
+ outerRadius: number
70
+ labelCentroid: number
71
+ labelFn: ((d: ComputedDatumSeries) => string)
72
+ labelColorType: ColorType
73
+ arcScaleType: ArcScaleType
74
+ }
75
+
76
+ export interface SeriesLegendParams {
77
+ position: 'top' | 'bottom' | 'left' | 'right'
78
+ justify: 'start' | 'center' | 'end'
79
+ padding: number
80
+ backgroundFill: ColorType
81
+ backgroundStroke: ColorType
82
+ gap: number
83
+ listRectWidth: number
84
+ listRectHeight: number
85
+ listRectRadius: number
86
+ textColorType: ColorType
87
+ }
@@ -1,23 +1,23 @@
1
- import type { TreeMapParams, TreeLegendParams } from './types'
2
-
3
- export const DEFAULT_TREE_MAP_PARAMS: TreeMapParams = {
4
- paddingInner: 2,
5
- paddingOuter: 2,
6
- labelColorType: 'primary',
7
- squarifyRatio: 1.618034, // 黃金比例
8
- sort: (a, b) => b.value - a.value
9
- }
10
- DEFAULT_TREE_MAP_PARAMS.sort.toString = () => `(a, b) => b.value - a.value`
11
-
12
- export const DEFAULT_TREE_LEGEND_PARAMS: TreeLegendParams = {
13
- position: 'right',
14
- justify: 'end',
15
- padding: 28,
16
- backgroundFill: 'none',
17
- backgroundStroke: 'none',
18
- gap: 10,
19
- listRectWidth: 14,
20
- listRectHeight: 14,
21
- listRectRadius: 0,
22
- textColorType: 'primary'
23
- }
1
+ import type { TreeMapParams, TreeLegendParams } from './types'
2
+
3
+ export const DEFAULT_TREE_MAP_PARAMS: TreeMapParams = {
4
+ paddingInner: 2,
5
+ paddingOuter: 2,
6
+ labelColorType: 'primary',
7
+ squarifyRatio: 1.618034, // 黃金比例
8
+ sort: (a, b) => b.value - a.value
9
+ }
10
+ DEFAULT_TREE_MAP_PARAMS.sort.toString = () => `(a, b) => b.value - a.value`
11
+
12
+ export const DEFAULT_TREE_LEGEND_PARAMS: TreeLegendParams = {
13
+ position: 'right',
14
+ justify: 'end',
15
+ padding: 28,
16
+ backgroundFill: 'none',
17
+ backgroundStroke: 'none',
18
+ gap: 10,
19
+ listRectWidth: 14,
20
+ listRectHeight: 14,
21
+ listRectRadius: 0,
22
+ textColorType: 'primary'
23
+ }
package/src/tree/index.ts CHANGED
@@ -1,4 +1,4 @@
1
- export * from './defaults'
2
- export * from './types'
3
- export { TreeLegend } from './plugins/TreeLegend'
1
+ export * from './defaults'
2
+ export * from './types'
3
+ export { TreeLegend } from './plugins/TreeLegend'
4
4
  export { TreeMap } from './plugins/TreeMap'
@@ -1,59 +1,59 @@
1
- import * as d3 from 'd3'
2
- import {
3
- combineLatest,
4
- map,
5
- switchMap,
6
- takeUntil,
7
- Observable,
8
- Subject } from 'rxjs'
9
- import {
10
- defineTreePlugin } from '@orbcharts/core'
11
- import { DEFAULT_TREE_LEGEND_PARAMS } from '../defaults'
12
- import { createBaseLegend } from '../../base/BaseLegend'
13
-
14
- const pluginName = 'TreeLegend'
15
-
16
- export const TreeLegend = defineTreePlugin(pluginName, DEFAULT_TREE_LEGEND_PARAMS)(({ selection, rootSelection, observer, subject }) => {
17
-
18
- const destroy$ = new Subject()
19
-
20
- const categoryLabels$: Observable<string[]> = observer.CategoryDataMap$.pipe(
21
- takeUntil(destroy$),
22
- map(data => {
23
- return Array.from(data.keys())
24
- })
25
- )
26
-
27
- // 全部列點矩型使用相同樣式參數
28
- const fullParams$ = observer.fullParams$.pipe(
29
- takeUntil(destroy$),
30
- map(d => {
31
- const seriesList = [
32
- {
33
- listRectWidth: d.listRectWidth,
34
- listRectHeight: d.listRectHeight,
35
- listRectRadius: d.listRectRadius,
36
- }
37
- ]
38
- return {
39
- ...d,
40
- seriesList
41
- }
42
- })
43
- )
44
-
45
- const unsubscribeBaseLegend = createBaseLegend(pluginName, {
46
- rootSelection,
47
- seriesLabels$: categoryLabels$,
48
- fullParams$,
49
- layout$: observer.layout$,
50
- fullChartParams$: observer.fullChartParams$,
51
- textSizePx$: observer.textSizePx$
52
- })
53
-
54
- return () => {
55
- destroy$.next(undefined)
56
- unsubscribeBaseLegend()
57
- }
58
- })
59
-
1
+ import * as d3 from 'd3'
2
+ import {
3
+ combineLatest,
4
+ map,
5
+ switchMap,
6
+ takeUntil,
7
+ Observable,
8
+ Subject } from 'rxjs'
9
+ import {
10
+ defineTreePlugin } from '@orbcharts/core'
11
+ import { DEFAULT_TREE_LEGEND_PARAMS } from '../defaults'
12
+ import { createBaseLegend } from '../../base/BaseLegend'
13
+
14
+ const pluginName = 'TreeLegend'
15
+
16
+ export const TreeLegend = defineTreePlugin(pluginName, DEFAULT_TREE_LEGEND_PARAMS)(({ selection, rootSelection, observer, subject }) => {
17
+
18
+ const destroy$ = new Subject()
19
+
20
+ const categoryLabels$: Observable<string[]> = observer.CategoryDataMap$.pipe(
21
+ takeUntil(destroy$),
22
+ map(data => {
23
+ return Array.from(data.keys())
24
+ })
25
+ )
26
+
27
+ // 全部列點矩型使用相同樣式參數
28
+ const fullParams$ = observer.fullParams$.pipe(
29
+ takeUntil(destroy$),
30
+ map(d => {
31
+ const seriesList = [
32
+ {
33
+ listRectWidth: d.listRectWidth,
34
+ listRectHeight: d.listRectHeight,
35
+ listRectRadius: d.listRectRadius,
36
+ }
37
+ ]
38
+ return {
39
+ ...d,
40
+ seriesList
41
+ }
42
+ })
43
+ )
44
+
45
+ const unsubscribeBaseLegend = createBaseLegend(pluginName, {
46
+ rootSelection,
47
+ seriesLabels$: categoryLabels$,
48
+ fullParams$,
49
+ layout$: observer.layout$,
50
+ fullChartParams$: observer.fullChartParams$,
51
+ textSizePx$: observer.textSizePx$
52
+ })
53
+
54
+ return () => {
55
+ destroy$.next(undefined)
56
+ unsubscribeBaseLegend()
57
+ }
58
+ })
59
+