@orbcharts/core 3.0.0-alpha.55 → 3.0.0-alpha.57

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 (83) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-core.es.js +221 -218
  3. package/dist/orbcharts-core.umd.js +2 -2
  4. package/package.json +41 -41
  5. package/src/AbstractChart.ts +48 -48
  6. package/src/GridChart.ts +20 -20
  7. package/src/MultiGridChart.ts +20 -20
  8. package/src/MultiValueChart.ts +20 -20
  9. package/src/RelationshipChart.ts +20 -20
  10. package/src/SeriesChart.ts +20 -20
  11. package/src/TreeChart.ts +20 -20
  12. package/src/base/createBaseChart.ts +369 -369
  13. package/src/base/createBasePlugin.ts +95 -95
  14. package/src/defaults.ts +226 -226
  15. package/src/defineGridPlugin.ts +3 -3
  16. package/src/defineMultiGridPlugin.ts +3 -3
  17. package/src/defineMultiValuePlugin.ts +3 -3
  18. package/src/defineNoneDataPlugin.ts +4 -4
  19. package/src/defineRelationshipPlugin.ts +3 -3
  20. package/src/defineSeriesPlugin.ts +3 -3
  21. package/src/defineTreePlugin.ts +3 -3
  22. package/src/grid/computeGridData.ts +134 -134
  23. package/src/grid/createGridContextObserver.ts +155 -155
  24. package/src/grid/gridObservables.ts +613 -607
  25. package/src/index.ts +21 -21
  26. package/src/multiGrid/computeMultiGridData.ts +130 -130
  27. package/src/multiGrid/createMultiGridContextObserver.ts +41 -41
  28. package/src/multiGrid/multiGridObservables.ts +365 -365
  29. package/src/multiValue/computeMultiValueData.ts +143 -143
  30. package/src/multiValue/createMultiValueContextObserver.ts +12 -12
  31. package/src/relationship/computeRelationshipData.ts +118 -118
  32. package/src/relationship/createRelationshipContextObserver.ts +12 -12
  33. package/src/series/computeSeriesData.ts +90 -90
  34. package/src/series/createSeriesContextObserver.ts +93 -93
  35. package/src/series/seriesObservables.ts +175 -175
  36. package/src/tree/computeTreeData.ts +132 -132
  37. package/src/tree/createTreeContextObserver.ts +61 -61
  38. package/src/tree/treeObservables.ts +94 -94
  39. package/src/types/Chart.ts +50 -50
  40. package/src/types/ChartParams.ts +51 -51
  41. package/src/types/ComputedData.ts +83 -83
  42. package/src/types/ComputedDataGrid.ts +13 -13
  43. package/src/types/ComputedDataMultiGrid.ts +2 -2
  44. package/src/types/ComputedDataMultiValue.ts +9 -9
  45. package/src/types/ComputedDataRelationship.ts +19 -19
  46. package/src/types/ComputedDataSeries.ts +7 -7
  47. package/src/types/ComputedDataTree.ts +19 -19
  48. package/src/types/ContextObserver.ts +38 -38
  49. package/src/types/ContextObserverGrid.ts +42 -42
  50. package/src/types/ContextObserverMultiGrid.ts +16 -16
  51. package/src/types/ContextObserverMultiValue.ts +4 -4
  52. package/src/types/ContextObserverRelationship.ts +4 -4
  53. package/src/types/ContextObserverSeries.ts +29 -29
  54. package/src/types/ContextObserverTree.ts +11 -11
  55. package/src/types/ContextSubject.ts +18 -18
  56. package/src/types/Data.ts +45 -45
  57. package/src/types/DataFormatter.ts +74 -74
  58. package/src/types/DataFormatterGrid.ts +67 -67
  59. package/src/types/DataFormatterMultiGrid.ts +44 -44
  60. package/src/types/DataFormatterMultiValue.ts +23 -23
  61. package/src/types/DataFormatterRelationship.ts +25 -25
  62. package/src/types/DataFormatterSeries.ts +20 -20
  63. package/src/types/DataFormatterTree.ts +12 -12
  64. package/src/types/DataGrid.ts +11 -11
  65. package/src/types/DataMultiGrid.ts +6 -6
  66. package/src/types/DataMultiValue.ts +12 -12
  67. package/src/types/DataRelationship.ts +27 -27
  68. package/src/types/DataSeries.ts +11 -11
  69. package/src/types/DataTree.ts +20 -20
  70. package/src/types/Event.ts +153 -153
  71. package/src/types/Layout.ts +11 -11
  72. package/src/types/Padding.ts +5 -5
  73. package/src/types/Plugin.ts +60 -60
  74. package/src/types/TransformData.ts +7 -7
  75. package/src/types/index.ts +37 -37
  76. package/src/utils/commonUtils.ts +50 -50
  77. package/src/utils/d3Utils.ts +92 -92
  78. package/src/utils/index.ts +4 -4
  79. package/src/utils/observables.ts +201 -201
  80. package/src/utils/orbchartsUtils.ts +349 -349
  81. package/tsconfig.base.json +13 -13
  82. package/tsconfig.json +2 -2
  83. package/vite.config.js +22 -22
package/src/index.ts CHANGED
@@ -1,21 +1,21 @@
1
-
2
- export { SeriesChart } from './SeriesChart'
3
- export { GridChart } from './GridChart'
4
- export { MultiGridChart } from './MultiGridChart'
5
- export { MultiValueChart } from './MultiValueChart'
6
- export { RelationshipChart } from './RelationshipChart'
7
- export { TreeChart } from './TreeChart'
8
-
9
- export { defineSeriesPlugin } from './defineSeriesPlugin'
10
- export { defineGridPlugin } from './defineGridPlugin'
11
- export { defineMultiGridPlugin } from './defineMultiGridPlugin'
12
- export { defineMultiValuePlugin } from './defineMultiValuePlugin'
13
- export { defineNoneDataPlugin } from './defineNoneDataPlugin'
14
- export { defineRelationshipPlugin } from './defineRelationshipPlugin'
15
- export { defineTreePlugin } from './defineTreePlugin'
16
-
17
- export * from './types'
18
- export * from './utils'
19
-
20
-
21
-
1
+
2
+ export { SeriesChart } from './SeriesChart'
3
+ export { GridChart } from './GridChart'
4
+ export { MultiGridChart } from './MultiGridChart'
5
+ export { MultiValueChart } from './MultiValueChart'
6
+ export { RelationshipChart } from './RelationshipChart'
7
+ export { TreeChart } from './TreeChart'
8
+
9
+ export { defineSeriesPlugin } from './defineSeriesPlugin'
10
+ export { defineGridPlugin } from './defineGridPlugin'
11
+ export { defineMultiGridPlugin } from './defineMultiGridPlugin'
12
+ export { defineMultiValuePlugin } from './defineMultiValuePlugin'
13
+ export { defineNoneDataPlugin } from './defineNoneDataPlugin'
14
+ export { defineRelationshipPlugin } from './defineRelationshipPlugin'
15
+ export { defineTreePlugin } from './defineTreePlugin'
16
+
17
+ export * from './types'
18
+ export * from './utils'
19
+
20
+
21
+
@@ -1,130 +1,130 @@
1
- import type { DataGrid, DataGridDatum } from '../types/DataGrid'
2
- import type { ComputedDataFn } from '../types/ComputedData'
3
- import type { ComputedDatumGrid } from '../types/ComputedDataGrid'
4
- import type { DataFormatterContext } from '../types/DataFormatter'
5
- import type { DataFormatterGridGrid } from '../types/DataFormatterGrid'
6
- import type { ComputedDataMultiGrid } from '../types/ComputedDataMultiGrid'
7
- // import { computeBaseGridData } from '../grid/computeGridData'
8
- import { DATA_FORMATTER_MULTI_GRID_GRID_DEFAULT } from '../defaults'
9
- import {
10
- createDefaultDatumId,
11
- seriesColorPredicate,
12
- createGridSeriesLabels,
13
- createMultiGridSeriesLabels,
14
- createMultiGridGroupLabels
15
- } from '../utils/orbchartsUtils'
16
- // import type { DataGridDatumTemp } from '../grid/computeGridData'
17
- import { createTransposedDataGrid } from '../grid/computeGridData'
18
-
19
- export const computeMultiGridData: ComputedDataFn<'multiGrid'> = (context) => {
20
- const { data = [], dataFormatter, chartParams } = context
21
- if (!data.length) {
22
- return []
23
- }
24
-
25
- let multiGridData: ComputedDataMultiGrid = []
26
-
27
- try {
28
- const defaultGrid = dataFormatter.gridList[0] || DATA_FORMATTER_MULTI_GRID_GRID_DEFAULT
29
-
30
- // 計算每個grid的dataFormatter
31
- const gridDataFormatterList: DataFormatterGridGrid[] = data.map((gridData, gridIndex) => {
32
- return dataFormatter.gridList[gridIndex] || defaultGrid
33
- })
34
-
35
- const transposedDataGridList = data.map((gridData, gridIndex) => {
36
- // 依seriesDirection轉置資料矩陣
37
- return createTransposedDataGrid(gridData, gridDataFormatterList[gridIndex])
38
- })
39
-
40
- // const isOverlappingMultiGrid = (() => {
41
- // const SlotIndexSet = new Set(gridDataFormatterList.map(d => d.slotIndex))
42
- // // 判斷是否有重疊的grid
43
- // return SlotIndexSet.size !== gridDataFormatterList.length
44
- // })()
45
-
46
- const multiGridSeriesLabels = dataFormatter.separateGrid
47
- // grid分開的時候,預設每組的seriesLabels相同
48
- ? transposedDataGridList
49
- .map((gridData, gridIndex) => {
50
- return createGridSeriesLabels({
51
- transposedDataGrid: gridData,
52
- dataFormatterGrid: gridDataFormatterList[gridIndex],
53
- chartType: 'multiGrid',
54
- })
55
- })
56
- // grid不分開的時候,預設每個grid相同seriesIndex的seriesLabel相同
57
- : transposedDataGridList
58
- .map((gridData, gridIndex) => {
59
- return createMultiGridSeriesLabels({
60
- transposedDataGrid: gridData,
61
- dataFormatterGrid: gridDataFormatterList[gridIndex],
62
- chartType: 'multiGrid',
63
- gridIndex
64
- })
65
- })
66
-
67
- const SeriesLabelColorMap: Map<string, string> = new Map()
68
- let accIndex = 0
69
- multiGridSeriesLabels.flat().forEach((label, i) => {
70
- if (!SeriesLabelColorMap.has(label)) {
71
- const color = seriesColorPredicate(accIndex, chartParams)
72
- SeriesLabelColorMap.set(label, color)
73
- accIndex ++
74
- }
75
- })
76
-
77
- // 計算每個grid的資料
78
- multiGridData = transposedDataGridList.map((gridData, gridIndex) => {
79
- const gridSeriesLabels = multiGridSeriesLabels[gridIndex]
80
- const groupLabels = createMultiGridGroupLabels({
81
- transposedDataGrid: gridData,
82
- dataFormatterGrid: gridDataFormatterList[gridIndex],
83
- chartType: 'multiGrid',
84
- gridIndex
85
- })
86
-
87
- let _index = 0
88
- let computedDataGrid: ComputedDatumGrid[][] = gridData.map((seriesData, seriesIndex) => {
89
- return seriesData.map((groupDatum, groupIndex) => {
90
-
91
- const defaultId = createDefaultDatumId('multiGrid', gridIndex, seriesIndex, groupIndex)
92
- const groupLabel = groupLabels[groupIndex]
93
- const seriesLabel = gridSeriesLabels[seriesIndex]
94
-
95
- const computedDatum: ComputedDatumGrid = {
96
- id: groupDatum.id ? groupDatum.id : defaultId,
97
- index: _index,
98
- label: groupDatum.label ? groupDatum.label : defaultId,
99
- description: groupDatum.description ?? '',
100
- data: groupDatum.data,
101
- value: groupDatum.value,
102
- gridIndex,
103
- // accSeriesIndex: seriesIndex, // 預設為seriesIndex
104
- seriesIndex,
105
- seriesLabel,
106
- groupIndex,
107
- groupLabel,
108
- color: SeriesLabelColorMap.get(seriesLabel),
109
- visible: true // 先給一個預設值
110
- }
111
-
112
- computedDatum.visible = dataFormatter.visibleFilter(computedDatum, context)
113
-
114
- _index ++
115
-
116
- return computedDatum
117
- })
118
- })
119
-
120
- return computedDataGrid
121
- })
122
-
123
-
124
- } catch (e) {
125
- // console.error(e)
126
- throw Error(e)
127
- }
128
-
129
- return multiGridData
130
- }
1
+ import type { DataGrid, DataGridDatum } from '../types/DataGrid'
2
+ import type { ComputedDataFn } from '../types/ComputedData'
3
+ import type { ComputedDatumGrid } from '../types/ComputedDataGrid'
4
+ import type { DataFormatterContext } from '../types/DataFormatter'
5
+ import type { DataFormatterGridGrid } from '../types/DataFormatterGrid'
6
+ import type { ComputedDataMultiGrid } from '../types/ComputedDataMultiGrid'
7
+ // import { computeBaseGridData } from '../grid/computeGridData'
8
+ import { DATA_FORMATTER_MULTI_GRID_GRID_DEFAULT } from '../defaults'
9
+ import {
10
+ createDefaultDatumId,
11
+ seriesColorPredicate,
12
+ createGridSeriesLabels,
13
+ createMultiGridSeriesLabels,
14
+ createMultiGridGroupLabels
15
+ } from '../utils/orbchartsUtils'
16
+ // import type { DataGridDatumTemp } from '../grid/computeGridData'
17
+ import { createTransposedDataGrid } from '../grid/computeGridData'
18
+
19
+ export const computeMultiGridData: ComputedDataFn<'multiGrid'> = (context) => {
20
+ const { data = [], dataFormatter, chartParams } = context
21
+ if (!data.length) {
22
+ return []
23
+ }
24
+
25
+ let multiGridData: ComputedDataMultiGrid = []
26
+
27
+ try {
28
+ const defaultGrid = dataFormatter.gridList[0] || DATA_FORMATTER_MULTI_GRID_GRID_DEFAULT
29
+
30
+ // 計算每個grid的dataFormatter
31
+ const gridDataFormatterList: DataFormatterGridGrid[] = data.map((gridData, gridIndex) => {
32
+ return dataFormatter.gridList[gridIndex] || defaultGrid
33
+ })
34
+
35
+ const transposedDataGridList = data.map((gridData, gridIndex) => {
36
+ // 依seriesDirection轉置資料矩陣
37
+ return createTransposedDataGrid(gridData, gridDataFormatterList[gridIndex])
38
+ })
39
+
40
+ // const isOverlappingMultiGrid = (() => {
41
+ // const SlotIndexSet = new Set(gridDataFormatterList.map(d => d.slotIndex))
42
+ // // 判斷是否有重疊的grid
43
+ // return SlotIndexSet.size !== gridDataFormatterList.length
44
+ // })()
45
+
46
+ const multiGridSeriesLabels = dataFormatter.separateGrid
47
+ // grid分開的時候,預設每組的seriesLabels相同
48
+ ? transposedDataGridList
49
+ .map((gridData, gridIndex) => {
50
+ return createGridSeriesLabels({
51
+ transposedDataGrid: gridData,
52
+ dataFormatterGrid: gridDataFormatterList[gridIndex],
53
+ chartType: 'multiGrid',
54
+ })
55
+ })
56
+ // grid不分開的時候,預設每個grid相同seriesIndex的seriesLabel相同
57
+ : transposedDataGridList
58
+ .map((gridData, gridIndex) => {
59
+ return createMultiGridSeriesLabels({
60
+ transposedDataGrid: gridData,
61
+ dataFormatterGrid: gridDataFormatterList[gridIndex],
62
+ chartType: 'multiGrid',
63
+ gridIndex
64
+ })
65
+ })
66
+
67
+ const SeriesLabelColorMap: Map<string, string> = new Map()
68
+ let accIndex = 0
69
+ multiGridSeriesLabels.flat().forEach((label, i) => {
70
+ if (!SeriesLabelColorMap.has(label)) {
71
+ const color = seriesColorPredicate(accIndex, chartParams)
72
+ SeriesLabelColorMap.set(label, color)
73
+ accIndex ++
74
+ }
75
+ })
76
+
77
+ // 計算每個grid的資料
78
+ multiGridData = transposedDataGridList.map((gridData, gridIndex) => {
79
+ const gridSeriesLabels = multiGridSeriesLabels[gridIndex]
80
+ const groupLabels = createMultiGridGroupLabels({
81
+ transposedDataGrid: gridData,
82
+ dataFormatterGrid: gridDataFormatterList[gridIndex],
83
+ chartType: 'multiGrid',
84
+ gridIndex
85
+ })
86
+
87
+ let _index = 0
88
+ let computedDataGrid: ComputedDatumGrid[][] = gridData.map((seriesData, seriesIndex) => {
89
+ return seriesData.map((groupDatum, groupIndex) => {
90
+
91
+ const defaultId = createDefaultDatumId('multiGrid', gridIndex, seriesIndex, groupIndex)
92
+ const groupLabel = groupLabels[groupIndex]
93
+ const seriesLabel = gridSeriesLabels[seriesIndex]
94
+
95
+ const computedDatum: ComputedDatumGrid = {
96
+ id: groupDatum.id ? groupDatum.id : defaultId,
97
+ index: _index,
98
+ label: groupDatum.label ? groupDatum.label : defaultId,
99
+ description: groupDatum.description ?? '',
100
+ data: groupDatum.data,
101
+ value: groupDatum.value,
102
+ gridIndex,
103
+ // accSeriesIndex: seriesIndex, // 預設為seriesIndex
104
+ seriesIndex,
105
+ seriesLabel,
106
+ groupIndex,
107
+ groupLabel,
108
+ color: SeriesLabelColorMap.get(seriesLabel),
109
+ visible: true // 先給一個預設值
110
+ }
111
+
112
+ computedDatum.visible = dataFormatter.visibleFilter(computedDatum, context)
113
+
114
+ _index ++
115
+
116
+ return computedDatum
117
+ })
118
+ })
119
+
120
+ return computedDataGrid
121
+ })
122
+
123
+
124
+ } catch (e) {
125
+ // console.error(e)
126
+ throw Error(e)
127
+ }
128
+
129
+ return multiGridData
130
+ }
@@ -1,41 +1,41 @@
1
- import {
2
- map,
3
- shareReplay } from 'rxjs'
4
- import type { ContextObserverFn } from '../types'
5
- import { multiGridEachDetailObservable, multiGridContainerObservable } from './multiGridObservables'
6
- import { textSizePxObservable } from '../utils/observables'
7
-
8
- export const createMultiGridContextObserver: ContextObserverFn<'multiGrid'> = ({ subject, observer }) => {
9
-
10
- const textSizePx$ = textSizePxObservable(observer.fullChartParams$).pipe(
11
- shareReplay(1)
12
- )
13
-
14
- const multiGridEachDetail$ = multiGridEachDetailObservable({
15
- fullDataFormatter$: observer.fullDataFormatter$,
16
- computedData$: observer.computedData$,
17
- layout$: observer.layout$,
18
- fullChartParams$: observer.fullChartParams$,
19
- event$: subject.event$
20
- }).pipe(
21
- shareReplay(1)
22
- )
23
-
24
- const multiGridContainerPosition$ = multiGridContainerObservable({
25
- computedData$: observer.computedData$,
26
- fullDataFormatter$: observer.fullDataFormatter$,
27
- layout$: observer.layout$,
28
- })
29
-
30
- return {
31
- fullParams$: observer.fullParams$,
32
- fullChartParams$: observer.fullChartParams$,
33
- fullDataFormatter$: observer.fullDataFormatter$,
34
- computedData$: observer.computedData$,
35
- layout$: observer.layout$,
36
- textSizePx$,
37
- multiGridContainerPosition$,
38
- multiGridEachDetail$,
39
- // multiGridContainer$
40
- }
41
- }
1
+ import {
2
+ map,
3
+ shareReplay } from 'rxjs'
4
+ import type { ContextObserverFn } from '../types'
5
+ import { multiGridEachDetailObservable, multiGridContainerObservable } from './multiGridObservables'
6
+ import { textSizePxObservable } from '../utils/observables'
7
+
8
+ export const createMultiGridContextObserver: ContextObserverFn<'multiGrid'> = ({ subject, observer }) => {
9
+
10
+ const textSizePx$ = textSizePxObservable(observer.fullChartParams$).pipe(
11
+ shareReplay(1)
12
+ )
13
+
14
+ const multiGridEachDetail$ = multiGridEachDetailObservable({
15
+ fullDataFormatter$: observer.fullDataFormatter$,
16
+ computedData$: observer.computedData$,
17
+ layout$: observer.layout$,
18
+ fullChartParams$: observer.fullChartParams$,
19
+ event$: subject.event$
20
+ }).pipe(
21
+ shareReplay(1)
22
+ )
23
+
24
+ const multiGridContainerPosition$ = multiGridContainerObservable({
25
+ computedData$: observer.computedData$,
26
+ fullDataFormatter$: observer.fullDataFormatter$,
27
+ layout$: observer.layout$,
28
+ })
29
+
30
+ return {
31
+ fullParams$: observer.fullParams$,
32
+ fullChartParams$: observer.fullChartParams$,
33
+ fullDataFormatter$: observer.fullDataFormatter$,
34
+ computedData$: observer.computedData$,
35
+ layout$: observer.layout$,
36
+ textSizePx$,
37
+ multiGridContainerPosition$,
38
+ multiGridEachDetail$,
39
+ // multiGridContainer$
40
+ }
41
+ }