@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,165 +1,164 @@
1
- import * as d3 from 'd3'
2
- import {
3
- of,
4
- map,
5
- switchMap,
6
- combineLatest,
7
- takeUntil,
8
- iif,
9
- Observable,
10
- Subject } from 'rxjs'
11
- import type { ContextObserverMultiGrid, DataFormatterGrid } from '@orbcharts/core'
12
- import {
13
- defineMultiGridPlugin } from '@orbcharts/core'
14
- import { DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS } from '../defaults'
15
- import { createBaseValueAxis } from '../../base/BaseValueAxis'
16
- import { multiGridDetailObservables } from '../multiGridObservables'
17
- import { getClassName, getUniID } from '../../utils/orbchartsUtils'
18
- // @Q@
19
- import { gridAxesTransformObservable, gridAxesReverseTransformObservable, gridContainerObservable } from '@orbcharts/core/src/grid/gridObservables'
20
-
21
- const pluginName = 'OverlappingValueAxes'
22
-
23
- const gridClassName = getClassName(pluginName, 'grid')
24
-
25
- export const OverlappingValueAxes = defineMultiGridPlugin(pluginName, DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS)(({ selection, name, subject, observer }) => {
26
- const destroy$ = new Subject()
27
-
28
- const unsubscribeFnArr: (() => void)[] = []
29
-
30
- const firstGridIndex$ = observer.fullParams$.pipe(
31
- takeUntil(destroy$),
32
- map(fullParams => fullParams.gridIndexes[0])
33
- )
34
-
35
- const secondGridIndex$ = observer.fullParams$.pipe(
36
- takeUntil(destroy$),
37
- map(fullParams => fullParams.gridIndexes[1])
38
- )
39
-
40
- // 為了要反轉第二個valueAxis的位置所以要重新計算
41
- const secondGridDataFormatter$: Observable<DataFormatterGrid> = combineLatest({
42
- firstGridIndex: firstGridIndex$,
43
- secondGridIndex: secondGridIndex$
44
- }).pipe(
45
- takeUntil(destroy$),
46
- switchMap(data => {
47
- return observer.fullDataFormatter$.pipe(
48
- takeUntil(destroy$),
49
- map(fullDataFormatter => {
50
- if (!fullDataFormatter.gridList[data.secondGridIndex]) {
51
- fullDataFormatter.gridList[data.secondGridIndex] = Object.assign({}, fullDataFormatter.gridList[data.firstGridIndex])
52
- }
53
- // 反轉第二個valueAxis的位置
54
- let reversePosition = ''
55
- if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'left') {
56
- reversePosition = 'right'
57
- } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'bottom') {
58
- reversePosition = 'top'
59
- } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'top') {
60
- reversePosition = 'bottom'
61
- } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'right') {
62
- reversePosition = 'left'
63
- }
64
- console.log('reversePosition', reversePosition)
65
- return <DataFormatterGrid>{
66
- type: 'grid',
67
- grid: {
68
- ...fullDataFormatter.gridList[data.secondGridIndex],
69
- valueAxis: {
70
- ...fullDataFormatter.gridList[data.secondGridIndex].valueAxis,
71
- position: reversePosition
72
- }
73
- },
74
- container: {
75
- ...fullDataFormatter.container
76
- }
77
- }
78
- })
79
- )
80
- }),
81
- )
82
-
83
- const multiGridPlugin$ = of(observer).pipe(
84
- takeUntil(destroy$),
85
- map(observer => {
86
- // 將observer的gridIndexes限制在2個
87
- return {
88
- ...observer,
89
- fullParams$: observer.fullParams$.pipe(
90
- map(fullParams => {
91
- if (fullParams.gridIndexes.length > 2) {
92
- fullParams.gridIndexes.length = 2
93
- }
94
- return fullParams
95
- })
96
- )
97
- }
98
- }),
99
- switchMap(observer => multiGridDetailObservables(observer)),
100
- map(data => {
101
- return data.map((observables, index) => {
102
- if (index === 0) {
103
- return observables
104
- }
105
- // index === 1,將跟第二個valueAxis有關的observables全部重新計算
106
- const gridAxesTransform$ = gridAxesTransformObservable({
107
- fullDataFormatter$: secondGridDataFormatter$,
108
- layout$: observer.layout$
109
- })
110
- const gridAxesReverseTransform$ = gridAxesReverseTransformObservable({
111
- gridAxesTransform$
112
- })
113
- const gridContainer$ = gridContainerObservable({
114
- computedData$: observables.gridComputedData$,
115
- fullDataFormatter$: secondGridDataFormatter$,
116
- fullChartParams$: observer.fullChartParams$,
117
- layout$: observer.layout$
118
- })
119
- return {
120
- ...observables,
121
- gridAxesTransform$,
122
- gridAxesReverseTransform$,
123
- gridContainer$,
124
- }
125
- })
126
- })
127
- )
128
-
129
- multiGridPlugin$.subscribe(data => {
130
- // 每次重新計算時,清除之前的訂閱
131
- unsubscribeFnArr.forEach(fn => fn())
132
-
133
- selection.selectAll(`g.${gridClassName}`)
134
- .data(data)
135
- .join('g')
136
- .attr('class', gridClassName)
137
- .each((d, i, g) => {
138
- if (i > 1) {
139
- return
140
- }
141
-
142
- const gridSelection = d3.select(g[i])
143
-
144
- unsubscribeFnArr[i] = createBaseValueAxis(pluginName, {
145
- selection: gridSelection,
146
- computedData$: d.gridComputedData$,
147
- fullParams$: observer.fullParams$.pipe(
148
- map(fullParams => i === 0 ? fullParams.firstAxis : fullParams.secondAxis)
149
- ),
150
- fullDataFormatter$: d.gridDataFormatter$,
151
- fullChartParams$: observer.fullChartParams$,
152
- gridAxesTransform$: d.gridAxesTransform$,
153
- gridAxesReverseTransform$: d.gridAxesReverseTransform$,
154
- gridAxesSize$: d.gridAxesSize$,
155
- gridContainer$: d.gridContainer$,
156
- isSeriesPositionSeprate$: d.isSeriesPositionSeprate$,
157
- })
158
- })
159
- })
160
-
161
- return () => {
162
- destroy$.next(undefined)
163
- unsubscribeFnArr.forEach(fn => fn())
164
- }
165
- })
1
+ import * as d3 from 'd3'
2
+ import {
3
+ of,
4
+ map,
5
+ switchMap,
6
+ combineLatest,
7
+ takeUntil,
8
+ iif,
9
+ Observable,
10
+ Subject } from 'rxjs'
11
+ import type { ContextObserverMultiGrid, DataFormatterGrid } from '@orbcharts/core'
12
+ import {
13
+ defineMultiGridPlugin } from '@orbcharts/core'
14
+ import { DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS } from '../defaults'
15
+ import { createBaseValueAxis } from '../../base/BaseValueAxis'
16
+ import { multiGridDetailObservables } from '../multiGridObservables'
17
+ import { getClassName, getUniID } from '../../utils/orbchartsUtils'
18
+ // @Q@
19
+ import { gridAxesTransformObservable, gridAxesReverseTransformObservable, gridContainerObservable } from '@orbcharts/core/src/grid/gridObservables'
20
+
21
+ const pluginName = 'OverlappingValueAxes'
22
+
23
+ const gridClassName = getClassName(pluginName, 'grid')
24
+
25
+ export const OverlappingValueAxes = defineMultiGridPlugin(pluginName, DEFAULT_OVERLAPPING_VALUE_AXES_PARAMS)(({ selection, name, subject, observer }) => {
26
+ const destroy$ = new Subject()
27
+
28
+ const unsubscribeFnArr: (() => void)[] = []
29
+
30
+ const firstGridIndex$ = observer.fullParams$.pipe(
31
+ takeUntil(destroy$),
32
+ map(fullParams => fullParams.gridIndexes[0])
33
+ )
34
+
35
+ const secondGridIndex$ = observer.fullParams$.pipe(
36
+ takeUntil(destroy$),
37
+ map(fullParams => fullParams.gridIndexes[1])
38
+ )
39
+
40
+ // 為了要反轉第二個valueAxis的位置所以要重新計算
41
+ const secondGridDataFormatter$: Observable<DataFormatterGrid> = combineLatest({
42
+ firstGridIndex: firstGridIndex$,
43
+ secondGridIndex: secondGridIndex$
44
+ }).pipe(
45
+ takeUntil(destroy$),
46
+ switchMap(data => {
47
+ return observer.fullDataFormatter$.pipe(
48
+ takeUntil(destroy$),
49
+ map(fullDataFormatter => {
50
+ if (!fullDataFormatter.gridList[data.secondGridIndex]) {
51
+ fullDataFormatter.gridList[data.secondGridIndex] = Object.assign({}, fullDataFormatter.gridList[data.firstGridIndex])
52
+ }
53
+ // 反轉第二個valueAxis的位置
54
+ let reversePosition = ''
55
+ if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'left') {
56
+ reversePosition = 'right'
57
+ } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'bottom') {
58
+ reversePosition = 'top'
59
+ } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'top') {
60
+ reversePosition = 'bottom'
61
+ } else if (fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'right') {
62
+ reversePosition = 'left'
63
+ }
64
+ return <DataFormatterGrid>{
65
+ type: 'grid',
66
+ grid: {
67
+ ...fullDataFormatter.gridList[data.secondGridIndex],
68
+ valueAxis: {
69
+ ...fullDataFormatter.gridList[data.secondGridIndex].valueAxis,
70
+ position: reversePosition
71
+ }
72
+ },
73
+ container: {
74
+ ...fullDataFormatter.container
75
+ }
76
+ }
77
+ })
78
+ )
79
+ }),
80
+ )
81
+
82
+ const multiGridPlugin$ = of(observer).pipe(
83
+ takeUntil(destroy$),
84
+ map(observer => {
85
+ // 將observer的gridIndexes限制在2個
86
+ return {
87
+ ...observer,
88
+ fullParams$: observer.fullParams$.pipe(
89
+ map(fullParams => {
90
+ if (fullParams.gridIndexes.length > 2) {
91
+ fullParams.gridIndexes.length = 2
92
+ }
93
+ return fullParams
94
+ })
95
+ )
96
+ }
97
+ }),
98
+ switchMap(observer => multiGridDetailObservables(observer)),
99
+ map(data => {
100
+ return data.map((observables, index) => {
101
+ if (index === 0) {
102
+ return observables
103
+ }
104
+ // index === 1,將跟第二個valueAxis有關的observables全部重新計算
105
+ const gridAxesTransform$ = gridAxesTransformObservable({
106
+ fullDataFormatter$: secondGridDataFormatter$,
107
+ layout$: observer.layout$
108
+ })
109
+ const gridAxesReverseTransform$ = gridAxesReverseTransformObservable({
110
+ gridAxesTransform$
111
+ })
112
+ const gridContainer$ = gridContainerObservable({
113
+ computedData$: observables.gridComputedData$,
114
+ fullDataFormatter$: secondGridDataFormatter$,
115
+ fullChartParams$: observer.fullChartParams$,
116
+ layout$: observer.layout$
117
+ })
118
+ return {
119
+ ...observables,
120
+ gridAxesTransform$,
121
+ gridAxesReverseTransform$,
122
+ gridContainer$,
123
+ }
124
+ })
125
+ })
126
+ )
127
+
128
+ multiGridPlugin$.subscribe(data => {
129
+ // 每次重新計算時,清除之前的訂閱
130
+ unsubscribeFnArr.forEach(fn => fn())
131
+
132
+ selection.selectAll(`g.${gridClassName}`)
133
+ .data(data)
134
+ .join('g')
135
+ .attr('class', gridClassName)
136
+ .each((d, i, g) => {
137
+ if (i > 1) {
138
+ return
139
+ }
140
+
141
+ const gridSelection = d3.select(g[i])
142
+
143
+ unsubscribeFnArr[i] = createBaseValueAxis(pluginName, {
144
+ selection: gridSelection,
145
+ computedData$: d.gridComputedData$,
146
+ fullParams$: observer.fullParams$.pipe(
147
+ map(fullParams => i === 0 ? fullParams.firstAxis : fullParams.secondAxis)
148
+ ),
149
+ fullDataFormatter$: d.gridDataFormatter$,
150
+ fullChartParams$: observer.fullChartParams$,
151
+ gridAxesTransform$: d.gridAxesTransform$,
152
+ gridAxesReverseTransform$: d.gridAxesReverseTransform$,
153
+ gridAxesSize$: d.gridAxesSize$,
154
+ gridContainer$: d.gridContainer$,
155
+ isSeriesPositionSeprate$: d.isSeriesPositionSeprate$,
156
+ })
157
+ })
158
+ })
159
+
160
+ return () => {
161
+ destroy$.next(undefined)
162
+ unsubscribeFnArr.forEach(fn => fn())
163
+ }
164
+ })
@@ -1,67 +1,67 @@
1
- import type { BaseBarsParams } from '../base/BaseBars'
2
- import type { BaseBarStackParams } from '../base/BaseBarStack'
3
- import type { BaseBarsTriangleParams } from '../base/BaseBarsTriangle'
4
- import type { BaseLinesParams } from '../base/BaseLines'
5
- import type { BaseDotsParams } from '../base/BaseDots'
6
- import type { BaseGroupAxisParams } from '../base/BaseGroupAxis'
7
- import type { BaseValueAxisParams } from '../base/BaseValueAxis'
8
- import type {
9
- ChartParams, Layout, ColorType } from '@orbcharts/core'
10
-
11
- export interface BarsAndLinesParams {
12
- bars: BaseBarsParams
13
- lines: BaseLinesParams
14
- }
15
-
16
- export interface MultiGridLegendParams {
17
- position: 'top' | 'bottom' | 'left' | 'right'
18
- justify: 'start' | 'center' | 'end'
19
- padding: number
20
- backgroundFill: ColorType
21
- backgroundStroke: ColorType
22
- gap: number
23
- listRectWidth: number
24
- listRectHeight: number
25
- listRectRadius: number
26
- // 可針對各grid設定,覆蓋全域設定
27
- gridList: Array<{
28
- listRectWidth: number
29
- listRectHeight: number
30
- listRectRadius: number
31
- }>
32
- textColorType: ColorType
33
- }
34
-
35
- export interface MultiGroupAxisParams extends BaseGroupAxisParams {
36
- gridIndexes: number[]
37
- }
38
-
39
- export interface MultiValueAxisParams extends BaseValueAxisParams {
40
- gridIndexes: number[]
41
- }
42
-
43
- export interface MultiBarsParams extends BaseBarsParams {
44
- gridIndexes: number[]
45
- }
46
-
47
- export interface MultiBarStackParams extends BaseBarStackParams {
48
- gridIndexes: number[]
49
- }
50
-
51
- export interface MultiBarsTriangleParams extends BaseBarsTriangleParams {
52
- gridIndexes: number[]
53
- }
54
-
55
- export interface MultiLinesParams extends BaseLinesParams {
56
- gridIndexes: number[]
57
- }
58
-
59
- export interface MultiDotsParams extends BaseDotsParams {
60
- gridIndexes: number[]
61
- }
62
-
63
- export interface OverlappingValueAxesParams {
64
- firstAxis: BaseValueAxisParams
65
- secondAxis: BaseValueAxisParams
66
- gridIndexes: [number, number]
67
- }
1
+ import type { BaseBarsParams } from '../base/BaseBars'
2
+ import type { BaseBarStackParams } from '../base/BaseBarStack'
3
+ import type { BaseBarsTriangleParams } from '../base/BaseBarsTriangle'
4
+ import type { BaseLinesParams } from '../base/BaseLines'
5
+ import type { BaseLineAreasParams } from '../base/BaseLineAreas'
6
+ import type { BaseDotsParams } from '../base/BaseDots'
7
+ import type { BaseGroupAxisParams } from '../base/BaseGroupAxis'
8
+ import type { BaseValueAxisParams } from '../base/BaseValueAxis'
9
+ import type {
10
+ ChartParams, Layout, ColorType } from '@orbcharts/core'
11
+
12
+ export interface MultiGridLegendParams {
13
+ position: 'top' | 'bottom' | 'left' | 'right'
14
+ justify: 'start' | 'center' | 'end'
15
+ padding: number
16
+ backgroundFill: ColorType
17
+ backgroundStroke: ColorType
18
+ gap: number
19
+ listRectWidth: number
20
+ listRectHeight: number
21
+ listRectRadius: number
22
+ // 可針對各grid設定,覆蓋全域設定
23
+ gridList: Array<{
24
+ listRectWidth: number
25
+ listRectHeight: number
26
+ listRectRadius: number
27
+ }>
28
+ textColorType: ColorType
29
+ }
30
+
31
+ export interface MultiGroupAxisParams extends BaseGroupAxisParams {
32
+ gridIndexes: number[]
33
+ }
34
+
35
+ export interface MultiValueAxisParams extends BaseValueAxisParams {
36
+ gridIndexes: number[]
37
+ }
38
+
39
+ export interface MultiBarsParams extends BaseBarsParams {
40
+ gridIndexes: number[]
41
+ }
42
+
43
+ export interface MultiBarStackParams extends BaseBarStackParams {
44
+ gridIndexes: number[]
45
+ }
46
+
47
+ export interface MultiBarsTriangleParams extends BaseBarsTriangleParams {
48
+ gridIndexes: number[]
49
+ }
50
+
51
+ export interface MultiLinesParams extends BaseLinesParams {
52
+ gridIndexes: number[]
53
+ }
54
+
55
+ export interface MultiLineAreasParams extends BaseLineAreasParams {
56
+ gridIndexes: number[]
57
+ }
58
+
59
+ export interface MultiDotsParams extends BaseDotsParams {
60
+ gridIndexes: number[]
61
+ }
62
+
63
+ export interface OverlappingValueAxesParams {
64
+ firstAxis: BaseValueAxisParams
65
+ secondAxis: BaseValueAxisParams
66
+ gridIndexes: [number, number]
67
+ }
@@ -1,61 +1,61 @@
1
- import type { ContainerPluginParams, TooltipParams } from './types'
2
- import type { EventBaseSeriesValue, EventBaseGridValue, EventBaseCategoryValue } from '@orbcharts/core'
3
-
4
- export const CONTAINER_PLUGIN_PARAMS: ContainerPluginParams = {
5
- header: {
6
- height: 36,
7
- text: [],
8
- textStyle: []
9
- },
10
- footer: {
11
- height: 0,
12
- text: [],
13
- textStyle: []
14
- }
15
- }
16
-
17
- export const TOOLTIP_PARAMS: TooltipParams = {
18
- backgroundColorType: 'background',
19
- strokeColorType: 'primary',
20
- backgroundOpacity: 0.8,
21
- textColorType: 'primary',
22
- offset: [20, 5],
23
- padding: 10,
24
- textRenderFn: (eventData) => {
25
- if (eventData.highlightTarget === 'datum' && eventData.datum) {
26
- return [`${eventData.datum.label}: ${eventData.datum.value}`]
27
- } else if (eventData.highlightTarget === 'series') {
28
- const label = (eventData as EventBaseSeriesValue<any, any>).seriesLabel
29
- const valueArr = (eventData as EventBaseSeriesValue<any, any>).series
30
- .map(d => {
31
- return d.value
32
- })
33
- const value = valueArr.length > 5
34
- ? valueArr.slice(0, 5).join(',') + '...'
35
- : valueArr.join(',')
36
- return [label, value]
37
- } else if (eventData.highlightTarget === 'group') {
38
- const label = (eventData as EventBaseGridValue<any, any>).groupLabel
39
- const valueArr = (eventData as EventBaseGridValue<any, any>).series
40
- .map(d => {
41
- return d.value
42
- })
43
- const value = valueArr.length > 5
44
- ? valueArr.slice(0, 5).join(',') + '...'
45
- : valueArr.join(',')
46
- return [label, value]
47
- } else if (eventData.highlightTarget === 'category') {
48
- const label = (eventData as EventBaseCategoryValue<any, any>).categoryLabel
49
- const valueArr = (eventData as EventBaseCategoryValue<any, any>).category
50
- .map(d => {
51
- return d.value
52
- })
53
- const value = valueArr.length > 5
54
- ? valueArr.slice(0, 5).join(',') + '...'
55
- : valueArr.join(',')
56
- return [label, value]
57
- }
58
- return []
59
- },
60
- svgRenderFn: null
61
- }
1
+ import type { ContainerPluginParams, TooltipParams } from './types'
2
+ import type { EventBaseSeriesValue, EventBaseGridValue, EventBaseCategoryValue } from '@orbcharts/core'
3
+
4
+ export const CONTAINER_PLUGIN_PARAMS: ContainerPluginParams = {
5
+ header: {
6
+ height: 36,
7
+ text: [],
8
+ textStyle: []
9
+ },
10
+ footer: {
11
+ height: 0,
12
+ text: [],
13
+ textStyle: []
14
+ }
15
+ }
16
+
17
+ export const TOOLTIP_PARAMS: TooltipParams = {
18
+ backgroundColorType: 'background',
19
+ strokeColorType: 'primary',
20
+ backgroundOpacity: 0.8,
21
+ textColorType: 'primary',
22
+ offset: [20, 5],
23
+ padding: 10,
24
+ textRenderFn: (eventData) => {
25
+ if (eventData.highlightTarget === 'datum' && eventData.datum) {
26
+ return [`${eventData.datum.label}: ${eventData.datum.value}`]
27
+ } else if (eventData.highlightTarget === 'series') {
28
+ const label = (eventData as EventBaseSeriesValue<any, any>).seriesLabel
29
+ const valueArr = (eventData as EventBaseSeriesValue<any, any>).series
30
+ .map(d => {
31
+ return d.value
32
+ })
33
+ const value = valueArr.length > 5
34
+ ? valueArr.slice(0, 5).join(',') + '...'
35
+ : valueArr.join(',')
36
+ return [label, value]
37
+ } else if (eventData.highlightTarget === 'group') {
38
+ const label = (eventData as EventBaseGridValue<any, any>).groupLabel
39
+ const valueArr = (eventData as EventBaseGridValue<any, any>).series
40
+ .map(d => {
41
+ return d.value
42
+ })
43
+ const value = valueArr.length > 5
44
+ ? valueArr.slice(0, 5).join(',') + '...'
45
+ : valueArr.join(',')
46
+ return [label, value]
47
+ } else if (eventData.highlightTarget === 'category') {
48
+ const label = (eventData as EventBaseCategoryValue<any, any>).categoryLabel
49
+ const valueArr = (eventData as EventBaseCategoryValue<any, any>).category
50
+ .map(d => {
51
+ return d.value
52
+ })
53
+ const value = valueArr.length > 5
54
+ ? valueArr.slice(0, 5).join(',') + '...'
55
+ : valueArr.join(',')
56
+ return [label, value]
57
+ }
58
+ return []
59
+ },
60
+ svgRenderFn: null
61
+ }
@@ -1,4 +1,4 @@
1
- export * from './defaults'
2
- export * from './types'
3
- export { Container } from './plugins/Container'
1
+ export * from './defaults'
2
+ export * from './types'
3
+ export { Container } from './plugins/Container'
4
4
  export { Tooltip } from './plugins/Tooltip'
@@ -1,11 +1,11 @@
1
- import * as d3 from 'd3'
2
- import {
3
- defineNoneDataPlugin } from '@orbcharts/core'
4
- import { CONTAINER_PLUGIN_PARAMS } from '../defaults'
5
-
6
- export const Container = defineNoneDataPlugin('Container', CONTAINER_PLUGIN_PARAMS)(({ selection }) => {
7
-
8
- return function unsubscribe () {
9
-
10
- }
1
+ import * as d3 from 'd3'
2
+ import {
3
+ defineNoneDataPlugin } from '@orbcharts/core'
4
+ import { CONTAINER_PLUGIN_PARAMS } from '../defaults'
5
+
6
+ export const Container = defineNoneDataPlugin('Container', CONTAINER_PLUGIN_PARAMS)(({ selection }) => {
7
+
8
+ return function unsubscribe () {
9
+
10
+ }
11
11
  })