@orbcharts/core 3.0.1 → 3.0.3
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.
- package/LICENSE +200 -200
- package/dist/orbcharts-core.es.js +2345 -2229
- package/dist/orbcharts-core.umd.js +5 -4
- package/dist/src/{utils → multiValue}/multiValueObservables.d.ts +20 -10
- package/dist/src/utils/errorMessage.d.ts +5 -0
- package/dist/src/utils/index.d.ts +0 -1
- package/dist/src/utils/observables.d.ts +3 -2
- package/dist/src/utils/orbchartsUtils.d.ts +1 -0
- package/lib/core-types.ts +7 -7
- package/package.json +46 -42
- package/src/AbstractChart.ts +57 -57
- package/src/GridChart.ts +24 -24
- package/src/MultiGridChart.ts +24 -24
- package/src/MultiValueChart.ts +24 -24
- package/src/RelationshipChart.ts +24 -24
- package/src/SeriesChart.ts +24 -24
- package/src/TreeChart.ts +24 -24
- package/src/base/createBaseChart.ts +526 -506
- package/src/base/createBasePlugin.ts +154 -154
- package/src/base/validators/chartOptionsValidator.ts +23 -23
- package/src/base/validators/chartParamsValidator.ts +133 -133
- package/src/base/validators/elementValidator.ts +13 -13
- package/src/base/validators/pluginsValidator.ts +14 -14
- package/src/defaults.ts +283 -282
- package/src/defineGridPlugin.ts +3 -3
- package/src/defineMultiGridPlugin.ts +3 -3
- package/src/defineMultiValuePlugin.ts +3 -3
- package/src/defineNoneDataPlugin.ts +4 -4
- package/src/defineRelationshipPlugin.ts +3 -3
- package/src/defineSeriesPlugin.ts +3 -3
- package/src/defineTreePlugin.ts +3 -3
- package/src/grid/computedDataFn.ts +129 -129
- package/src/grid/contextObserverCallback.ts +201 -198
- package/src/grid/dataFormatterValidator.ts +125 -120
- package/src/grid/dataValidator.ts +12 -12
- package/src/{utils → grid}/gridObservables.ts +718 -705
- package/src/index.ts +20 -20
- package/src/multiGrid/computedDataFn.ts +123 -123
- package/src/multiGrid/contextObserverCallback.ts +75 -72
- package/src/multiGrid/dataFormatterValidator.ts +120 -115
- package/src/multiGrid/dataValidator.ts +12 -12
- package/src/{utils → multiGrid}/multiGridObservables.ts +401 -401
- package/src/multiValue/computedDataFn.ts +113 -113
- package/src/multiValue/contextObserverCallback.ts +328 -276
- package/src/multiValue/dataFormatterValidator.ts +94 -89
- package/src/multiValue/dataValidator.ts +12 -12
- package/src/{utils → multiValue}/multiValueObservables.ts +1219 -1044
- package/src/relationship/computedDataFn.ts +159 -159
- package/src/relationship/contextObserverCallback.ts +80 -80
- package/src/relationship/dataFormatterValidator.ts +13 -13
- package/src/relationship/dataValidator.ts +13 -13
- package/src/{utils → relationship}/relationshipObservables.ts +84 -84
- package/src/series/computedDataFn.ts +88 -88
- package/src/series/contextObserverCallback.ts +107 -107
- package/src/series/dataFormatterValidator.ts +46 -41
- package/src/series/dataValidator.ts +12 -12
- package/src/{utils → series}/seriesObservables.ts +175 -175
- package/src/tree/computedDataFn.ts +129 -129
- package/src/tree/contextObserverCallback.ts +58 -58
- package/src/tree/dataFormatterValidator.ts +13 -13
- package/src/tree/dataValidator.ts +13 -13
- package/src/{utils → tree}/treeObservables.ts +105 -105
- package/src/utils/commonUtils.ts +55 -55
- package/src/utils/d3Scale.ts +198 -198
- package/src/utils/errorMessage.ts +43 -42
- package/src/utils/index.ts +4 -10
- package/src/utils/observables.ts +293 -281
- package/src/utils/orbchartsUtils.ts +396 -377
- package/src/utils/validator.ts +126 -126
- package/tsconfig.base.json +13 -13
- package/tsconfig.json +2 -2
- package/vite-env.d.ts +6 -6
- package/vite.config.js +22 -22
- /package/dist/src/{utils → grid}/gridObservables.d.ts +0 -0
- /package/dist/src/{utils → multiGrid}/multiGridObservables.d.ts +0 -0
- /package/dist/src/{utils → relationship}/relationshipObservables.d.ts +0 -0
- /package/dist/src/{utils → series}/seriesObservables.d.ts +0 -0
- /package/dist/src/{utils → tree}/treeObservables.d.ts +0 -0
@@ -1,176 +1,176 @@
|
|
1
|
-
import {
|
2
|
-
combineLatest,
|
3
|
-
distinctUntilChanged,
|
4
|
-
filter,
|
5
|
-
map,
|
6
|
-
merge,
|
7
|
-
takeUntil,
|
8
|
-
shareReplay,
|
9
|
-
switchMap,
|
10
|
-
Subject,
|
11
|
-
Observable } from 'rxjs'
|
12
|
-
import type {
|
13
|
-
ChartParams,
|
14
|
-
ComputedDatumSeries,
|
15
|
-
ComputedDataTypeMap,
|
16
|
-
DataFormatterTypeMap,
|
17
|
-
ContainerPosition,
|
18
|
-
Layout } from '../../lib/core-types'
|
19
|
-
import { calcContainerPosition } from '
|
20
|
-
|
21
|
-
export const separateSeriesObservable = ({ fullDataFormatter$ }: { fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>> }) => {
|
22
|
-
return fullDataFormatter$.pipe(
|
23
|
-
map(data => data.separateSeries),
|
24
|
-
distinctUntilChanged(),
|
25
|
-
)
|
26
|
-
}
|
27
|
-
|
28
|
-
export const seriesLabelsObservable = ({ computedData$ }: { computedData$: Observable<ComputedDataTypeMap<'series'>> }) => {
|
29
|
-
return computedData$.pipe(
|
30
|
-
map(data => {
|
31
|
-
return data
|
32
|
-
.filter(series => series.length)
|
33
|
-
.map(series => {
|
34
|
-
return series[0].seriesLabel
|
35
|
-
})
|
36
|
-
}),
|
37
|
-
distinctUntilChanged((a, b) => {
|
38
|
-
return JSON.stringify(a).length === JSON.stringify(b).length
|
39
|
-
}),
|
40
|
-
)
|
41
|
-
}
|
42
|
-
|
43
|
-
export const seriesVisibleComputedDataObservable = ({ computedData$ }: { computedData$: Observable<ComputedDataTypeMap<'series'>> }) => {
|
44
|
-
return computedData$.pipe(
|
45
|
-
map(data => {
|
46
|
-
return data.map(series => {
|
47
|
-
return series.filter(datum => datum.visible != false)
|
48
|
-
})
|
49
|
-
})
|
50
|
-
)
|
51
|
-
}
|
52
|
-
|
53
|
-
export const seriesComputedSortedDataObservable = ({ computedData$, fullDataFormatter$ }: {
|
54
|
-
computedData$: Observable<ComputedDataTypeMap<'series'>>,
|
55
|
-
fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>>
|
56
|
-
}) => {
|
57
|
-
return combineLatest({
|
58
|
-
computedData: computedData$,
|
59
|
-
fullDataFormatter: fullDataFormatter$
|
60
|
-
}).pipe(
|
61
|
-
switchMap(async (d) => d),
|
62
|
-
map(data => {
|
63
|
-
const sumData: ComputedDatumSeries[][] = data.fullDataFormatter.sumSeries == true
|
64
|
-
? data.computedData.map(d => {
|
65
|
-
return [
|
66
|
-
// 加總為一筆資料
|
67
|
-
d.reduce((acc, current) => {
|
68
|
-
if (acc == null) {
|
69
|
-
return current // 取得第一筆資料
|
70
|
-
}
|
71
|
-
acc.value = acc.value + current.value
|
72
|
-
return acc
|
73
|
-
}, null)
|
74
|
-
]
|
75
|
-
})
|
76
|
-
: data.computedData
|
77
|
-
|
78
|
-
return data.fullDataFormatter.separateSeries == true
|
79
|
-
// 有拆分的話每個series為一組
|
80
|
-
? sumData
|
81
|
-
.map(series => {
|
82
|
-
return series.sort((a, b) => a.seq - b.seq)
|
83
|
-
})
|
84
|
-
// 無拆分的話所有資料為一組
|
85
|
-
: [
|
86
|
-
sumData
|
87
|
-
.flat()
|
88
|
-
.sort((a, b) => a.seq - b.seq)
|
89
|
-
]
|
90
|
-
})
|
91
|
-
)
|
92
|
-
}
|
93
|
-
|
94
|
-
|
95
|
-
// 所有container位置(對應series)
|
96
|
-
export const seriesContainerPositionObservable = ({ computedData$, fullDataFormatter$, layout$ }: {
|
97
|
-
computedData$: Observable<ComputedDataTypeMap<'series'>>
|
98
|
-
fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>>
|
99
|
-
layout$: Observable<Layout>
|
100
|
-
}): Observable<ContainerPosition[]> => {
|
101
|
-
|
102
|
-
const gridContainerPosition$ = combineLatest({
|
103
|
-
computedData: computedData$,
|
104
|
-
fullDataFormatter: fullDataFormatter$,
|
105
|
-
layout: layout$,
|
106
|
-
}).pipe(
|
107
|
-
switchMap(async (d) => d),
|
108
|
-
map(data => {
|
109
|
-
|
110
|
-
if (data.fullDataFormatter.separateSeries) {
|
111
|
-
// -- 依slotIndexes計算 --
|
112
|
-
return calcContainerPosition(data.layout, data.fullDataFormatter.container, data.computedData.length)
|
113
|
-
// return data.computedData.map((seriesData, seriesIndex) => {
|
114
|
-
// const columnIndex = seriesIndex % data.fullDataFormatter.container.columnAmount
|
115
|
-
// const rowIndex = Math.floor(seriesIndex / data.fullDataFormatter.container.columnAmount)
|
116
|
-
// const { startX, startY, centerX, centerY, width, height } = calcContainerPosition(data.layout, data.fullDataFormatter.container, rowIndex, columnIndex)
|
117
|
-
// return {
|
118
|
-
// slotIndex: seriesIndex,
|
119
|
-
// rowIndex,
|
120
|
-
// columnIndex,
|
121
|
-
// startX,
|
122
|
-
// startY,
|
123
|
-
// centerX,
|
124
|
-
// centerY,
|
125
|
-
// width,
|
126
|
-
// height,
|
127
|
-
// }
|
128
|
-
// })
|
129
|
-
} else {
|
130
|
-
// -- 無拆分 --
|
131
|
-
return calcContainerPosition(data.layout, data.fullDataFormatter.container, 1)
|
132
|
-
// const columnIndex = 0
|
133
|
-
// const rowIndex = 0
|
134
|
-
// return data.computedData.map((seriesData, seriesIndex) => {
|
135
|
-
// const { startX, startY, centerX, centerY, width, height } = calcContainerPosition(data.layout, data.fullDataFormatter.container, rowIndex, columnIndex)
|
136
|
-
// return {
|
137
|
-
// slotIndex: 0,
|
138
|
-
// rowIndex,
|
139
|
-
// columnIndex,
|
140
|
-
// startX,
|
141
|
-
// startY,
|
142
|
-
// centerX,
|
143
|
-
// centerY,
|
144
|
-
// width,
|
145
|
-
// height,
|
146
|
-
// }
|
147
|
-
// })
|
148
|
-
}
|
149
|
-
})
|
150
|
-
)
|
151
|
-
|
152
|
-
return gridContainerPosition$
|
153
|
-
}
|
154
|
-
|
155
|
-
export const seriesContainerPositionMapObservable = ({ seriesContainerPosition$, seriesLabels$, separateSeries$ }: {
|
156
|
-
seriesContainerPosition$: Observable<ContainerPosition[]>
|
157
|
-
seriesLabels$: Observable<string[]>
|
158
|
-
separateSeries$: Observable<boolean>
|
159
|
-
}) => {
|
160
|
-
return combineLatest({
|
161
|
-
seriesContainerPosition: seriesContainerPosition$,
|
162
|
-
seriesLabels: seriesLabels$,
|
163
|
-
separateSeries: separateSeries$,
|
164
|
-
}).pipe(
|
165
|
-
switchMap(async (d) => d),
|
166
|
-
map(data => {
|
167
|
-
return data.separateSeries
|
168
|
-
? new Map<string, ContainerPosition>(data.seriesLabels.map((seriesLabel, seriesIndex) => {
|
169
|
-
return [seriesLabel, data.seriesContainerPosition[seriesIndex] ?? data.seriesContainerPosition[0]]
|
170
|
-
}))
|
171
|
-
: new Map<string, ContainerPosition>(data.seriesLabels.map((seriesLabel, seriesIndex) => {
|
172
|
-
return [seriesLabel, data.seriesContainerPosition[0]]
|
173
|
-
}))
|
174
|
-
})
|
175
|
-
)
|
1
|
+
import {
|
2
|
+
combineLatest,
|
3
|
+
distinctUntilChanged,
|
4
|
+
filter,
|
5
|
+
map,
|
6
|
+
merge,
|
7
|
+
takeUntil,
|
8
|
+
shareReplay,
|
9
|
+
switchMap,
|
10
|
+
Subject,
|
11
|
+
Observable } from 'rxjs'
|
12
|
+
import type {
|
13
|
+
ChartParams,
|
14
|
+
ComputedDatumSeries,
|
15
|
+
ComputedDataTypeMap,
|
16
|
+
DataFormatterTypeMap,
|
17
|
+
ContainerPosition,
|
18
|
+
Layout } from '../../lib/core-types'
|
19
|
+
import { calcContainerPosition } from '../utils/orbchartsUtils'
|
20
|
+
|
21
|
+
export const separateSeriesObservable = ({ fullDataFormatter$ }: { fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>> }) => {
|
22
|
+
return fullDataFormatter$.pipe(
|
23
|
+
map(data => data.separateSeries),
|
24
|
+
distinctUntilChanged(),
|
25
|
+
)
|
26
|
+
}
|
27
|
+
|
28
|
+
export const seriesLabelsObservable = ({ computedData$ }: { computedData$: Observable<ComputedDataTypeMap<'series'>> }) => {
|
29
|
+
return computedData$.pipe(
|
30
|
+
map(data => {
|
31
|
+
return data
|
32
|
+
.filter(series => series.length)
|
33
|
+
.map(series => {
|
34
|
+
return series[0].seriesLabel
|
35
|
+
})
|
36
|
+
}),
|
37
|
+
distinctUntilChanged((a, b) => {
|
38
|
+
return JSON.stringify(a).length === JSON.stringify(b).length
|
39
|
+
}),
|
40
|
+
)
|
41
|
+
}
|
42
|
+
|
43
|
+
export const seriesVisibleComputedDataObservable = ({ computedData$ }: { computedData$: Observable<ComputedDataTypeMap<'series'>> }) => {
|
44
|
+
return computedData$.pipe(
|
45
|
+
map(data => {
|
46
|
+
return data.map(series => {
|
47
|
+
return series.filter(datum => datum.visible != false)
|
48
|
+
})
|
49
|
+
})
|
50
|
+
)
|
51
|
+
}
|
52
|
+
|
53
|
+
export const seriesComputedSortedDataObservable = ({ computedData$, fullDataFormatter$ }: {
|
54
|
+
computedData$: Observable<ComputedDataTypeMap<'series'>>,
|
55
|
+
fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>>
|
56
|
+
}) => {
|
57
|
+
return combineLatest({
|
58
|
+
computedData: computedData$,
|
59
|
+
fullDataFormatter: fullDataFormatter$
|
60
|
+
}).pipe(
|
61
|
+
switchMap(async (d) => d),
|
62
|
+
map(data => {
|
63
|
+
const sumData: ComputedDatumSeries[][] = data.fullDataFormatter.sumSeries == true
|
64
|
+
? data.computedData.map(d => {
|
65
|
+
return [
|
66
|
+
// 加總為一筆資料
|
67
|
+
d.reduce((acc, current) => {
|
68
|
+
if (acc == null) {
|
69
|
+
return current // 取得第一筆資料
|
70
|
+
}
|
71
|
+
acc.value = acc.value + current.value
|
72
|
+
return acc
|
73
|
+
}, null)
|
74
|
+
]
|
75
|
+
})
|
76
|
+
: data.computedData
|
77
|
+
|
78
|
+
return data.fullDataFormatter.separateSeries == true
|
79
|
+
// 有拆分的話每個series為一組
|
80
|
+
? sumData
|
81
|
+
.map(series => {
|
82
|
+
return series.sort((a, b) => a.seq - b.seq)
|
83
|
+
})
|
84
|
+
// 無拆分的話所有資料為一組
|
85
|
+
: [
|
86
|
+
sumData
|
87
|
+
.flat()
|
88
|
+
.sort((a, b) => a.seq - b.seq)
|
89
|
+
]
|
90
|
+
})
|
91
|
+
)
|
92
|
+
}
|
93
|
+
|
94
|
+
|
95
|
+
// 所有container位置(對應series)
|
96
|
+
export const seriesContainerPositionObservable = ({ computedData$, fullDataFormatter$, layout$ }: {
|
97
|
+
computedData$: Observable<ComputedDataTypeMap<'series'>>
|
98
|
+
fullDataFormatter$: Observable<DataFormatterTypeMap<'series'>>
|
99
|
+
layout$: Observable<Layout>
|
100
|
+
}): Observable<ContainerPosition[]> => {
|
101
|
+
|
102
|
+
const gridContainerPosition$ = combineLatest({
|
103
|
+
computedData: computedData$,
|
104
|
+
fullDataFormatter: fullDataFormatter$,
|
105
|
+
layout: layout$,
|
106
|
+
}).pipe(
|
107
|
+
switchMap(async (d) => d),
|
108
|
+
map(data => {
|
109
|
+
|
110
|
+
if (data.fullDataFormatter.separateSeries) {
|
111
|
+
// -- 依slotIndexes計算 --
|
112
|
+
return calcContainerPosition(data.layout, data.fullDataFormatter.container, data.computedData.length)
|
113
|
+
// return data.computedData.map((seriesData, seriesIndex) => {
|
114
|
+
// const columnIndex = seriesIndex % data.fullDataFormatter.container.columnAmount
|
115
|
+
// const rowIndex = Math.floor(seriesIndex / data.fullDataFormatter.container.columnAmount)
|
116
|
+
// const { startX, startY, centerX, centerY, width, height } = calcContainerPosition(data.layout, data.fullDataFormatter.container, rowIndex, columnIndex)
|
117
|
+
// return {
|
118
|
+
// slotIndex: seriesIndex,
|
119
|
+
// rowIndex,
|
120
|
+
// columnIndex,
|
121
|
+
// startX,
|
122
|
+
// startY,
|
123
|
+
// centerX,
|
124
|
+
// centerY,
|
125
|
+
// width,
|
126
|
+
// height,
|
127
|
+
// }
|
128
|
+
// })
|
129
|
+
} else {
|
130
|
+
// -- 無拆分 --
|
131
|
+
return calcContainerPosition(data.layout, data.fullDataFormatter.container, 1)
|
132
|
+
// const columnIndex = 0
|
133
|
+
// const rowIndex = 0
|
134
|
+
// return data.computedData.map((seriesData, seriesIndex) => {
|
135
|
+
// const { startX, startY, centerX, centerY, width, height } = calcContainerPosition(data.layout, data.fullDataFormatter.container, rowIndex, columnIndex)
|
136
|
+
// return {
|
137
|
+
// slotIndex: 0,
|
138
|
+
// rowIndex,
|
139
|
+
// columnIndex,
|
140
|
+
// startX,
|
141
|
+
// startY,
|
142
|
+
// centerX,
|
143
|
+
// centerY,
|
144
|
+
// width,
|
145
|
+
// height,
|
146
|
+
// }
|
147
|
+
// })
|
148
|
+
}
|
149
|
+
})
|
150
|
+
)
|
151
|
+
|
152
|
+
return gridContainerPosition$
|
153
|
+
}
|
154
|
+
|
155
|
+
export const seriesContainerPositionMapObservable = ({ seriesContainerPosition$, seriesLabels$, separateSeries$ }: {
|
156
|
+
seriesContainerPosition$: Observable<ContainerPosition[]>
|
157
|
+
seriesLabels$: Observable<string[]>
|
158
|
+
separateSeries$: Observable<boolean>
|
159
|
+
}) => {
|
160
|
+
return combineLatest({
|
161
|
+
seriesContainerPosition: seriesContainerPosition$,
|
162
|
+
seriesLabels: seriesLabels$,
|
163
|
+
separateSeries: separateSeries$,
|
164
|
+
}).pipe(
|
165
|
+
switchMap(async (d) => d),
|
166
|
+
map(data => {
|
167
|
+
return data.separateSeries
|
168
|
+
? new Map<string, ContainerPosition>(data.seriesLabels.map((seriesLabel, seriesIndex) => {
|
169
|
+
return [seriesLabel, data.seriesContainerPosition[seriesIndex] ?? data.seriesContainerPosition[0]]
|
170
|
+
}))
|
171
|
+
: new Map<string, ContainerPosition>(data.seriesLabels.map((seriesLabel, seriesIndex) => {
|
172
|
+
return [seriesLabel, data.seriesContainerPosition[0]]
|
173
|
+
}))
|
174
|
+
})
|
175
|
+
)
|
176
176
|
}
|
@@ -1,129 +1,129 @@
|
|
1
|
-
import type { DataTree, DataTreeObj, DataTreeDatum, ComputedDataFn, ComputedDataTree } from '../../lib/core-types'
|
2
|
-
import { isPlainObject } from '../utils/commonUtils'
|
3
|
-
import { seriesColorPredicate, createDefaultCategoryLabel } from '../utils/orbchartsUtils'
|
4
|
-
|
5
|
-
export const computedDataFn: ComputedDataFn<'tree'> = (context) => {
|
6
|
-
const { data = [], dataFormatter, chartParams } = context
|
7
|
-
|
8
|
-
const defaultCategoryLabel = createDefaultCategoryLabel()
|
9
|
-
|
10
|
-
// <categoryLabel, categoryIndex>
|
11
|
-
const CategoryIndexMap = new Map<string, number>(
|
12
|
-
dataFormatter.categoryLabels.map((label, index) => [label, index])
|
13
|
-
)
|
14
|
-
|
15
|
-
let computedBranchData: ComputedDataTree = {
|
16
|
-
id: '',
|
17
|
-
index: 0,
|
18
|
-
label: '',
|
19
|
-
description: '',
|
20
|
-
categoryIndex: -1,
|
21
|
-
categoryLabel: '',
|
22
|
-
color: '',
|
23
|
-
visible: true,
|
24
|
-
// tooltipContent: '',
|
25
|
-
data: {},
|
26
|
-
value: 0,
|
27
|
-
level: 0,
|
28
|
-
seq: 0,
|
29
|
-
children: []
|
30
|
-
}
|
31
|
-
|
32
|
-
try {
|
33
|
-
// 建立樹狀結構資料
|
34
|
-
const dataTreeObj: DataTreeObj = (function () {
|
35
|
-
if (isPlainObject(data) === true) {
|
36
|
-
// 原本就是樹狀結構則直接複製
|
37
|
-
// return structuredClone(data) as DataTreeObj
|
38
|
-
return JSON.parse(JSON.stringify(data)) as DataTreeObj
|
39
|
-
} else if (Array.isArray(data) === false) {
|
40
|
-
return {
|
41
|
-
id: ''
|
42
|
-
}
|
43
|
-
}
|
44
|
-
// -- 陣列格式轉物件 --
|
45
|
-
// let rootId = ''
|
46
|
-
let root: DataTreeDatum | undefined = undefined
|
47
|
-
// const DataMap: Map<string, DataTreeDatum> = new Map()
|
48
|
-
const ChildrenMap: Map<string, DataTreeDatum[]> = new Map()
|
49
|
-
;(data as DataTreeDatum[]).forEach(d => {
|
50
|
-
// DataMap.set(d.id, d)
|
51
|
-
|
52
|
-
if (!d.parent) {
|
53
|
-
// rootId = d.id
|
54
|
-
root = d
|
55
|
-
} else {
|
56
|
-
const children: DataTreeDatum[] = ChildrenMap.get(d.parent) ?? []
|
57
|
-
children.push(d)
|
58
|
-
ChildrenMap.set(d.parent!, children)
|
59
|
-
}
|
60
|
-
})
|
61
|
-
|
62
|
-
const createBranchData = (root: DataTreeDatum): DataTreeObj => {
|
63
|
-
return {
|
64
|
-
id: root.id,
|
65
|
-
label: root.label,
|
66
|
-
data: root.data,
|
67
|
-
// tooltipContent: root.tooltipContent,
|
68
|
-
value: root.value,
|
69
|
-
categoryLabel: root.categoryLabel ?? defaultCategoryLabel,
|
70
|
-
children: (ChildrenMap.get(root.id) ?? []).map(d => {
|
71
|
-
// 遞迴
|
72
|
-
return createBranchData(d)
|
73
|
-
})
|
74
|
-
}
|
75
|
-
}
|
76
|
-
if (root) {
|
77
|
-
return createBranchData(root)
|
78
|
-
} else {
|
79
|
-
return {
|
80
|
-
id: ''
|
81
|
-
}
|
82
|
-
}
|
83
|
-
})()
|
84
|
-
|
85
|
-
let index = 0
|
86
|
-
|
87
|
-
const formatBranchData = (branch: DataTreeObj, level: number, seq: number): ComputedDataTree => {
|
88
|
-
const childLayer = level + 1
|
89
|
-
const categoryLabel: string = branch.categoryLabel ?? defaultCategoryLabel
|
90
|
-
if (!CategoryIndexMap.has(categoryLabel)) {
|
91
|
-
CategoryIndexMap.set(categoryLabel, CategoryIndexMap.size)
|
92
|
-
}
|
93
|
-
const categoryIndex = CategoryIndexMap.get(categoryLabel) ?? 0
|
94
|
-
|
95
|
-
const currentIndex = index
|
96
|
-
index++
|
97
|
-
const formattedBranchData: ComputedDataTree = {
|
98
|
-
id: branch.id,
|
99
|
-
index: currentIndex,
|
100
|
-
level,
|
101
|
-
seq,
|
102
|
-
label: branch.label ?? '',
|
103
|
-
description: branch.description ?? '',
|
104
|
-
categoryIndex,
|
105
|
-
categoryLabel,
|
106
|
-
color: seriesColorPredicate(categoryIndex, chartParams),
|
107
|
-
data: branch.data ?? {},
|
108
|
-
// tooltipContent: branch.tooltipContent ? branch.tooltipContent : dataFormatter.tooltipContentFormat(branch, level, seq, context),
|
109
|
-
value: branch.value,
|
110
|
-
visible: true, // 先給預設值
|
111
|
-
children: (branch.children ?? []).map((d, i) => {
|
112
|
-
// 遞迴
|
113
|
-
return formatBranchData(d, childLayer, i)
|
114
|
-
})
|
115
|
-
}
|
116
|
-
|
117
|
-
formattedBranchData.visible = dataFormatter.visibleFilter(formattedBranchData, context)
|
118
|
-
|
119
|
-
return formattedBranchData
|
120
|
-
}
|
121
|
-
computedBranchData = formatBranchData(dataTreeObj, 0, 0)
|
122
|
-
} catch (e) {
|
123
|
-
// console.error(e)
|
124
|
-
throw Error(e)
|
125
|
-
}
|
126
|
-
|
127
|
-
return computedBranchData
|
128
|
-
|
129
|
-
}
|
1
|
+
import type { DataTree, DataTreeObj, DataTreeDatum, ComputedDataFn, ComputedDataTree } from '../../lib/core-types'
|
2
|
+
import { isPlainObject } from '../utils/commonUtils'
|
3
|
+
import { seriesColorPredicate, createDefaultCategoryLabel } from '../utils/orbchartsUtils'
|
4
|
+
|
5
|
+
export const computedDataFn: ComputedDataFn<'tree'> = (context) => {
|
6
|
+
const { data = [], dataFormatter, chartParams } = context
|
7
|
+
|
8
|
+
const defaultCategoryLabel = createDefaultCategoryLabel()
|
9
|
+
|
10
|
+
// <categoryLabel, categoryIndex>
|
11
|
+
const CategoryIndexMap = new Map<string, number>(
|
12
|
+
dataFormatter.categoryLabels.map((label, index) => [label, index])
|
13
|
+
)
|
14
|
+
|
15
|
+
let computedBranchData: ComputedDataTree = {
|
16
|
+
id: '',
|
17
|
+
index: 0,
|
18
|
+
label: '',
|
19
|
+
description: '',
|
20
|
+
categoryIndex: -1,
|
21
|
+
categoryLabel: '',
|
22
|
+
color: '',
|
23
|
+
visible: true,
|
24
|
+
// tooltipContent: '',
|
25
|
+
data: {},
|
26
|
+
value: 0,
|
27
|
+
level: 0,
|
28
|
+
seq: 0,
|
29
|
+
children: []
|
30
|
+
}
|
31
|
+
|
32
|
+
try {
|
33
|
+
// 建立樹狀結構資料
|
34
|
+
const dataTreeObj: DataTreeObj = (function () {
|
35
|
+
if (isPlainObject(data) === true) {
|
36
|
+
// 原本就是樹狀結構則直接複製
|
37
|
+
// return structuredClone(data) as DataTreeObj
|
38
|
+
return JSON.parse(JSON.stringify(data)) as DataTreeObj
|
39
|
+
} else if (Array.isArray(data) === false) {
|
40
|
+
return {
|
41
|
+
id: ''
|
42
|
+
}
|
43
|
+
}
|
44
|
+
// -- 陣列格式轉物件 --
|
45
|
+
// let rootId = ''
|
46
|
+
let root: DataTreeDatum | undefined = undefined
|
47
|
+
// const DataMap: Map<string, DataTreeDatum> = new Map()
|
48
|
+
const ChildrenMap: Map<string, DataTreeDatum[]> = new Map()
|
49
|
+
;(data as DataTreeDatum[]).forEach(d => {
|
50
|
+
// DataMap.set(d.id, d)
|
51
|
+
|
52
|
+
if (!d.parent) {
|
53
|
+
// rootId = d.id
|
54
|
+
root = d
|
55
|
+
} else {
|
56
|
+
const children: DataTreeDatum[] = ChildrenMap.get(d.parent) ?? []
|
57
|
+
children.push(d)
|
58
|
+
ChildrenMap.set(d.parent!, children)
|
59
|
+
}
|
60
|
+
})
|
61
|
+
|
62
|
+
const createBranchData = (root: DataTreeDatum): DataTreeObj => {
|
63
|
+
return {
|
64
|
+
id: root.id,
|
65
|
+
label: root.label,
|
66
|
+
data: root.data,
|
67
|
+
// tooltipContent: root.tooltipContent,
|
68
|
+
value: root.value,
|
69
|
+
categoryLabel: root.categoryLabel ?? defaultCategoryLabel,
|
70
|
+
children: (ChildrenMap.get(root.id) ?? []).map(d => {
|
71
|
+
// 遞迴
|
72
|
+
return createBranchData(d)
|
73
|
+
})
|
74
|
+
}
|
75
|
+
}
|
76
|
+
if (root) {
|
77
|
+
return createBranchData(root)
|
78
|
+
} else {
|
79
|
+
return {
|
80
|
+
id: ''
|
81
|
+
}
|
82
|
+
}
|
83
|
+
})()
|
84
|
+
|
85
|
+
let index = 0
|
86
|
+
|
87
|
+
const formatBranchData = (branch: DataTreeObj, level: number, seq: number): ComputedDataTree => {
|
88
|
+
const childLayer = level + 1
|
89
|
+
const categoryLabel: string = branch.categoryLabel ?? defaultCategoryLabel
|
90
|
+
if (!CategoryIndexMap.has(categoryLabel)) {
|
91
|
+
CategoryIndexMap.set(categoryLabel, CategoryIndexMap.size)
|
92
|
+
}
|
93
|
+
const categoryIndex = CategoryIndexMap.get(categoryLabel) ?? 0
|
94
|
+
|
95
|
+
const currentIndex = index
|
96
|
+
index++
|
97
|
+
const formattedBranchData: ComputedDataTree = {
|
98
|
+
id: branch.id,
|
99
|
+
index: currentIndex,
|
100
|
+
level,
|
101
|
+
seq,
|
102
|
+
label: branch.label ?? '',
|
103
|
+
description: branch.description ?? '',
|
104
|
+
categoryIndex,
|
105
|
+
categoryLabel,
|
106
|
+
color: seriesColorPredicate(categoryIndex, chartParams),
|
107
|
+
data: branch.data ?? {},
|
108
|
+
// tooltipContent: branch.tooltipContent ? branch.tooltipContent : dataFormatter.tooltipContentFormat(branch, level, seq, context),
|
109
|
+
value: branch.value,
|
110
|
+
visible: true, // 先給預設值
|
111
|
+
children: (branch.children ?? []).map((d, i) => {
|
112
|
+
// 遞迴
|
113
|
+
return formatBranchData(d, childLayer, i)
|
114
|
+
})
|
115
|
+
}
|
116
|
+
|
117
|
+
formattedBranchData.visible = dataFormatter.visibleFilter(formattedBranchData, context)
|
118
|
+
|
119
|
+
return formattedBranchData
|
120
|
+
}
|
121
|
+
computedBranchData = formatBranchData(dataTreeObj, 0, 0)
|
122
|
+
} catch (e) {
|
123
|
+
// console.error(e)
|
124
|
+
throw Error(e)
|
125
|
+
}
|
126
|
+
|
127
|
+
return computedBranchData
|
128
|
+
|
129
|
+
}
|