@orbcharts/plugins-basic 3.0.0-alpha.67 → 3.0.0-alpha.69

Sign up to get free protection for your applications and to get access to all the features.
Files changed (79) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-plugins-basic.es.js +3436 -3358
  3. package/dist/orbcharts-plugins-basic.umd.js +14 -13
  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 +174 -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
+