@orbcharts/core 3.0.0-alpha.39 → 3.0.0-alpha.40

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 (86) hide show
  1. package/LICENSE +200 -200
  2. package/dist/orbcharts-core.es.js +6 -6
  3. package/dist/orbcharts-core.umd.js +1 -1
  4. package/dist/src/types/ContextObserverGrid.d.ts +1 -1
  5. package/dist/src/types/ContextObserverSeries.d.ts +1 -1
  6. package/dist/src/types/ContextObserverTree.d.ts +1 -1
  7. package/dist/src/utils/observables.d.ts +5 -5
  8. package/package.json +41 -41
  9. package/src/AbstractChart.ts +48 -48
  10. package/src/GridChart.ts +20 -20
  11. package/src/MultiGridChart.ts +20 -20
  12. package/src/MultiValueChart.ts +20 -20
  13. package/src/RelationshipChart.ts +20 -20
  14. package/src/SeriesChart.ts +20 -20
  15. package/src/TreeChart.ts +20 -20
  16. package/src/base/createBaseChart.ts +367 -367
  17. package/src/base/createBasePlugin.ts +89 -89
  18. package/src/defaults.ts +247 -247
  19. package/src/defineGridPlugin.ts +3 -3
  20. package/src/defineMultiGridPlugin.ts +3 -3
  21. package/src/defineMultiValuePlugin.ts +3 -3
  22. package/src/defineNoneDataPlugin.ts +4 -4
  23. package/src/defineRelationshipPlugin.ts +3 -3
  24. package/src/defineSeriesPlugin.ts +3 -3
  25. package/src/defineTreePlugin.ts +3 -3
  26. package/src/grid/computeGridData.ts +205 -205
  27. package/src/grid/createGridContextObserver.ts +124 -124
  28. package/src/grid/gridObservables.ts +486 -486
  29. package/src/index.ts +21 -21
  30. package/src/multiGrid/computeMultiGridData.ts +173 -173
  31. package/src/multiGrid/createMultiGridContextObserver.ts +34 -34
  32. package/src/multiGrid/multiGridObservables.ts +285 -285
  33. package/src/multiValue/computeMultiValueData.ts +136 -136
  34. package/src/multiValue/createMultiValueContextObserver.ts +12 -12
  35. package/src/relationship/computeRelationshipData.ts +106 -106
  36. package/src/relationship/createRelationshipContextObserver.ts +12 -12
  37. package/src/series/computeSeriesData.ts +153 -153
  38. package/src/series/createSeriesContextObserver.ts +33 -33
  39. package/src/series/seriesObservables.ts +23 -23
  40. package/src/tree/computeTreeData.ts +128 -128
  41. package/src/tree/createTreeContextObserver.ts +56 -56
  42. package/src/tree/treeObservables.ts +94 -94
  43. package/src/types/Chart.ts +48 -48
  44. package/src/types/ChartParams.ts +51 -51
  45. package/src/types/ComputedData.ts +82 -82
  46. package/src/types/ComputedDataGrid.ts +13 -13
  47. package/src/types/ComputedDataMultiGrid.ts +2 -2
  48. package/src/types/ComputedDataMultiValue.ts +9 -9
  49. package/src/types/ComputedDataRelationship.ts +19 -19
  50. package/src/types/ComputedDataSeries.ts +7 -7
  51. package/src/types/ComputedDataTree.ts +19 -19
  52. package/src/types/ContextObserver.ts +38 -38
  53. package/src/types/ContextObserverGrid.ts +33 -33
  54. package/src/types/ContextObserverMultiGrid.ts +27 -27
  55. package/src/types/ContextObserverMultiValue.ts +4 -4
  56. package/src/types/ContextObserverRelationship.ts +4 -4
  57. package/src/types/ContextObserverSeries.ts +7 -7
  58. package/src/types/ContextObserverTree.ts +10 -10
  59. package/src/types/ContextSubject.ts +18 -18
  60. package/src/types/Data.ts +45 -45
  61. package/src/types/DataFormatter.ts +95 -95
  62. package/src/types/DataFormatterGrid.ts +55 -55
  63. package/src/types/DataFormatterMultiGrid.ts +42 -42
  64. package/src/types/DataFormatterMultiValue.ts +20 -20
  65. package/src/types/DataFormatterRelationship.ts +22 -22
  66. package/src/types/DataFormatterSeries.ts +29 -29
  67. package/src/types/DataFormatterTree.ts +12 -12
  68. package/src/types/DataGrid.ts +11 -11
  69. package/src/types/DataMultiGrid.ts +6 -6
  70. package/src/types/DataMultiValue.ts +12 -12
  71. package/src/types/DataRelationship.ts +27 -27
  72. package/src/types/DataSeries.ts +11 -11
  73. package/src/types/DataTree.ts +20 -20
  74. package/src/types/Event.ts +153 -153
  75. package/src/types/Layout.ts +11 -11
  76. package/src/types/Padding.ts +5 -5
  77. package/src/types/Plugin.ts +60 -60
  78. package/src/types/TransformData.ts +7 -7
  79. package/src/types/index.ts +37 -37
  80. package/src/utils/commonUtils.ts +50 -50
  81. package/src/utils/d3Utils.ts +89 -89
  82. package/src/utils/index.ts +4 -4
  83. package/src/utils/observables.ts +181 -183
  84. package/src/utils/orbchartsUtils.ts +253 -253
  85. package/tsconfig.json +13 -13
  86. package/vite.config.js +44 -44
@@ -1,253 +1,253 @@
1
- import * as d3 from 'd3'
2
- import type { ChartType } from '../types/Chart'
3
- import type { ChartParams } from '../types/ChartParams'
4
- import type { DatumBase, DatumValue } from '../types/Data'
5
- import type { DataSeries, DataSeriesDatum, DataSeriesValue } from '../types/DataSeries'
6
- import type { DataGrid, DataGridDatum, DataGridValue } from '../types/DataGrid'
7
- import type { DataMultiGrid } from '../types/DataMultiGrid'
8
- import type { DataMultiValue, DataMultiValueDatum, DataMultiValueValue } from '../types/DataMultiValue'
9
- import type { SeriesDirection, DataFormatterGrid, DataFormatterGridContainer } from '../types/DataFormatterGrid'
10
- import type { DataFormatterMultiGrid } from '../types/DataFormatterMultiGrid'
11
- import type { ComputedDatumSeriesValue } from '../types/ComputedData'
12
- import type { ComputedDatumSeries } from '../types/ComputedDataSeries'
13
- import type { ComputedDatumGrid, ComputedDataGrid } from '../types/ComputedDataGrid'
14
- import type { ComputedDataMultiGrid } from '../types/ComputedDataMultiGrid'
15
- import type { Layout } from '../types/Layout'
16
- // import type { ComputedDatumMultiGrid } from '../types/ComputedDataMultiGrid'
17
- import { isPlainObject } from './commonUtils'
18
-
19
- export function formatValueToLabel (value: any, valueFormatter: string | ((text: d3.NumberValue) => string)) {
20
- if (valueFormatter! instanceof Function == true) {
21
- return (valueFormatter as ((text: d3.NumberValue) => string))(value)
22
- }
23
- return d3.format(valueFormatter as string)!(value)
24
- }
25
-
26
- export function createDefaultDatumId (chartTypeOrPrefix: string, levelOneIndex: number, levelTwoIndex: number, levelThreeIndex?: number) {
27
- let text = `${chartTypeOrPrefix}_${levelOneIndex}_${levelTwoIndex}`
28
- if (levelThreeIndex != null) {
29
- text += `_${levelThreeIndex}`
30
- }
31
- return text
32
- }
33
-
34
- export function createDefaultSeriesLabel (chartTypeOrPrefix: string, seriesIndex: number) {
35
- return `${chartTypeOrPrefix}_series${seriesIndex}`
36
- }
37
-
38
- export function createDefaultGroupLabel (chartTypeOrPrefix: string, groupIndex: number) {
39
- return `${chartTypeOrPrefix}_group${groupIndex}`
40
- }
41
-
42
- export function createGridSeriesLabels ({ transposedDataGrid, dataFormatter, chartType = 'grid' }: {
43
- transposedDataGrid: DataGridDatum[][],
44
- dataFormatter: DataFormatterGrid
45
- chartType?: ChartType
46
- }) {
47
- const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
48
- ? dataFormatter.grid.gridData.rowLabels
49
- : dataFormatter.grid.gridData.columnLabels
50
- return transposedDataGrid.map((_, rowIndex) => {
51
- return labels[rowIndex] != null
52
- ? labels[rowIndex]
53
- : createDefaultSeriesLabel(chartType, rowIndex)
54
- })
55
- }
56
-
57
- export function createMultiGridSeriesLabels ({ transposedDataGrid, dataFormatter, chartType = 'multiGrid', gridIndex = 0 }: {
58
- transposedDataGrid: DataGridDatum[][],
59
- dataFormatter: DataFormatterGrid
60
- chartType?: ChartType
61
- gridIndex?: number
62
- }) {
63
- const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
64
- ? dataFormatter.grid.gridData.rowLabels
65
- : dataFormatter.grid.gridData.columnLabels
66
- return transposedDataGrid.map((_, rowIndex) => {
67
- return labels[rowIndex] != null
68
- ? labels[rowIndex]
69
- : createDefaultSeriesLabel(`${chartType}_grid${gridIndex}`, rowIndex)
70
- })
71
- }
72
-
73
- export function createGridGroupLabels ({ transposedDataGrid, dataFormatter, chartType = 'grid' }: {
74
- transposedDataGrid: DataGridDatum[][],
75
- dataFormatter: DataFormatterGrid
76
- chartType?: ChartType
77
- }) {
78
- if (transposedDataGrid[0] == null) {
79
- return []
80
- }
81
- const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
82
- ? dataFormatter.grid.gridData.columnLabels
83
- : dataFormatter.grid.gridData.rowLabels
84
- return transposedDataGrid[0].map((_, columnLabels) => {
85
- return labels[columnLabels] != null
86
- ? labels[columnLabels]
87
- : createDefaultGroupLabel(chartType, columnLabels)
88
- })
89
- }
90
-
91
- export function createMultiGridGroupLabels ({ transposedDataGrid, dataFormatter, chartType = 'multiGrid', gridIndex = 0 }: {
92
- transposedDataGrid: DataGridDatum[][],
93
- dataFormatter: DataFormatterGrid
94
- chartType?: ChartType
95
- gridIndex?: number
96
- }) {
97
- if (transposedDataGrid[0] == null) {
98
- return []
99
- }
100
- const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
101
- ? dataFormatter.grid.gridData.columnLabels
102
- : dataFormatter.grid.gridData.rowLabels
103
- return transposedDataGrid[0].map((_, columnLabels) => {
104
- return labels[columnLabels] != null
105
- ? labels[columnLabels]
106
- : createDefaultGroupLabel(`${chartType}_grid${gridIndex}`, columnLabels)
107
- })
108
- }
109
-
110
- // 取得最小及最大值 - 數字陣列
111
- export function getMinAndMax (data: number[]): [number, number] {
112
- const defaultMinAndMax: [number, number] = [0, 0] // default
113
- if (!data.length) {
114
- return defaultMinAndMax
115
- }
116
- const minAndMax: [number, number] = data.reduce((prev, current) => {
117
- // [min, max]
118
- return [
119
- current < prev[0] ? current : prev[0],
120
- current > prev[1] ? current : prev[1]
121
- ]
122
- }, [data[0], data[0]])
123
- return minAndMax
124
- }
125
-
126
- // 取得最小及最大值 - datum格式陣列資料
127
- export function getMinAndMaxValue (data: DatumValue[]): [number, number] {
128
- const arr = data
129
- .filter(d => d != null && d.value != null)
130
- .map(d => d.value )
131
- return getMinAndMax(arr)
132
- }
133
-
134
- // 取得最小及最大值 - Series Data
135
- export function getMinAndMaxSeries (data: DataSeries): [number, number] {
136
- const flatData: (DataSeriesValue | DataSeriesDatum)[] = data[0] && Array.isArray((data as (DataSeriesValue | DataSeriesDatum)[][])[0])
137
- ? data.flat()
138
- : data as (DataSeriesValue | DataSeriesDatum)[]
139
- const arr = flatData
140
- .filter(d => (d == null || (isPlainObject(d) && (d as DataSeriesDatum).value == null)) === false) // 過濾掉null &
141
- .map(d => typeof d === 'number' ? d : d.value )
142
- return getMinAndMax(arr)
143
- }
144
-
145
- // 取得最小及最大值 - Grid Data
146
- export function getMinAndMaxGrid (data: DataGrid): [number, number] {
147
- const flatData: (DataGridValue | DataGridDatum)[] = data.flat()
148
- const arr = flatData
149
- .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
150
- .map(d => typeof d === 'number' ? d : d.value )
151
- return getMinAndMax(arr)
152
- }
153
-
154
- // 取得最小及最大值 - MultiGrid Data
155
- export function getMinAndMaxMultiGrid (data: DataMultiGrid): [number, number] {
156
- const flatData: (DataGridValue | DataGridDatum)[] = data.flat().flat()
157
- const arr = flatData
158
- .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
159
- .map(d => typeof d === 'number' ? d : d.value )
160
- return getMinAndMax(arr)
161
- }
162
-
163
- // 取得最小及最大值 - MultiValue Data
164
- export function getMinAndMaxMultiValue (data: DataMultiValue, valueIndex: number = 2): [number, number] {
165
- const flatData: (DataMultiValueDatum | DataMultiValueValue)[] = data.flat().filter((d, i) => i == valueIndex)
166
- const arr = flatData
167
- .filter(d => (d == null || (isPlainObject(d) && (d as DataMultiValueDatum).value == null)) === false) // 過濾掉null
168
- .map(d => typeof d === 'number' ? d : d.value )
169
- return getMinAndMax(arr)
170
- }
171
-
172
- // @Q@ 待處理
173
- // // 取得最小及最大值 - Relationship Data
174
- // export function getMinAndMaxRelationship (data: DataRelationship, target: 'nodes' | 'edges' = 'nodes'): [number, number] {
175
-
176
- // }
177
-
178
- // @Q@ 待處理
179
- // // 取得最小及最大值 - Tree Data
180
- // export function getMinAndMaxTree (data: DataTree): [number, number] {
181
-
182
- // }
183
-
184
- // 轉置成seriesDirection為main的陣列格式
185
- export function transposeData<T> (seriesDirection: SeriesDirection, data: T[][]): T[][] {
186
- if (seriesDirection === 'row') {
187
- return Object.assign([], data)
188
- }
189
- // 取得原始陣列的維度
190
- const rows = data.length;
191
- const cols = data.reduce((prev, current) => {
192
- return Math.max(prev, current.length)
193
- }, 0)
194
-
195
- // 初始化轉換後的陣列
196
- const transposedArray = new Array(cols).fill(null).map(() => new Array(rows).fill(null))
197
-
198
- // 遍歷原始陣列,進行轉換
199
- for (let i = 0; i < rows; i++) {
200
- for (let j = 0; j < cols; j++) {
201
- transposedArray[j][i] = data[i][j]
202
- }
203
- }
204
-
205
- return transposedArray
206
- }
207
-
208
-
209
- export function seriesColorPredicate (seriesIndex: number, chartParams: ChartParams) {
210
- return seriesIndex < chartParams.colors[chartParams.colorScheme].series.length
211
- ? chartParams.colors[chartParams.colorScheme].series[seriesIndex]
212
- : chartParams.colors[chartParams.colorScheme].series[
213
- seriesIndex % chartParams.colors[chartParams.colorScheme].series.length
214
- ]
215
- }
216
-
217
- export function calcGridContainerPosition (layout: Layout, container: DataFormatterGridContainer, rowIndex: number, columnIndex: number) {
218
- const { gap, rowAmount, columnAmount } = container
219
- const width = (layout.width - (gap * (columnAmount - 1))) / columnAmount
220
- const height = (layout.height - (gap * (rowAmount - 1))) / rowAmount
221
- const x = columnIndex * width + (columnIndex * gap)
222
- const y = rowIndex * height + (rowIndex * gap)
223
- const translate: [number, number] = [x, y]
224
- const scale: [number, number] = [width / layout.width, height / layout.height]
225
-
226
- return {
227
- translate,
228
- scale
229
- }
230
- }
231
-
232
- // // multiGrid datum color
233
- // export function multiGridColorPredicate ({ seriesIndex, groupIndex, data, chartParams }: {
234
- // seriesIndex: number
235
- // groupIndex: number
236
- // data: ComputedDataMultiGrid
237
- // chartParams: ChartParams
238
- // }) {
239
- // // 累加前面的grid的seriesIndex
240
- // const accSeriesIndex = data.reduce((prev, current) => {
241
- // if (current[0] && current[0][0] && groupIndex > current[0][0].gridIndex) {
242
- // return prev + current[0].length
243
- // } else if (current[0] && current[0][0] && groupIndex == current[0][0].gridIndex) {
244
- // return prev + seriesIndex
245
- // } else {
246
- // return prev
247
- // }
248
- // }, 0)
249
-
250
- // return seriesColorPredicate(accSeriesIndex, chartParams)
251
- // }
252
-
253
-
1
+ import * as d3 from 'd3'
2
+ import type { ChartType } from '../types/Chart'
3
+ import type { ChartParams } from '../types/ChartParams'
4
+ import type { DatumBase, DatumValue } from '../types/Data'
5
+ import type { DataSeries, DataSeriesDatum, DataSeriesValue } from '../types/DataSeries'
6
+ import type { DataGrid, DataGridDatum, DataGridValue } from '../types/DataGrid'
7
+ import type { DataMultiGrid } from '../types/DataMultiGrid'
8
+ import type { DataMultiValue, DataMultiValueDatum, DataMultiValueValue } from '../types/DataMultiValue'
9
+ import type { SeriesDirection, DataFormatterGrid, DataFormatterGridContainer } from '../types/DataFormatterGrid'
10
+ import type { DataFormatterMultiGrid } from '../types/DataFormatterMultiGrid'
11
+ import type { ComputedDatumSeriesValue } from '../types/ComputedData'
12
+ import type { ComputedDatumSeries } from '../types/ComputedDataSeries'
13
+ import type { ComputedDatumGrid, ComputedDataGrid } from '../types/ComputedDataGrid'
14
+ import type { ComputedDataMultiGrid } from '../types/ComputedDataMultiGrid'
15
+ import type { Layout } from '../types/Layout'
16
+ // import type { ComputedDatumMultiGrid } from '../types/ComputedDataMultiGrid'
17
+ import { isPlainObject } from './commonUtils'
18
+
19
+ export function formatValueToLabel (value: any, valueFormatter: string | ((text: d3.NumberValue) => string)) {
20
+ if (valueFormatter! instanceof Function == true) {
21
+ return (valueFormatter as ((text: d3.NumberValue) => string))(value)
22
+ }
23
+ return d3.format(valueFormatter as string)!(value)
24
+ }
25
+
26
+ export function createDefaultDatumId (chartTypeOrPrefix: string, levelOneIndex: number, levelTwoIndex: number, levelThreeIndex?: number) {
27
+ let text = `${chartTypeOrPrefix}_${levelOneIndex}_${levelTwoIndex}`
28
+ if (levelThreeIndex != null) {
29
+ text += `_${levelThreeIndex}`
30
+ }
31
+ return text
32
+ }
33
+
34
+ export function createDefaultSeriesLabel (chartTypeOrPrefix: string, seriesIndex: number) {
35
+ return `${chartTypeOrPrefix}_series${seriesIndex}`
36
+ }
37
+
38
+ export function createDefaultGroupLabel (chartTypeOrPrefix: string, groupIndex: number) {
39
+ return `${chartTypeOrPrefix}_group${groupIndex}`
40
+ }
41
+
42
+ export function createGridSeriesLabels ({ transposedDataGrid, dataFormatter, chartType = 'grid' }: {
43
+ transposedDataGrid: DataGridDatum[][],
44
+ dataFormatter: DataFormatterGrid
45
+ chartType?: ChartType
46
+ }) {
47
+ const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
48
+ ? dataFormatter.grid.gridData.rowLabels
49
+ : dataFormatter.grid.gridData.columnLabels
50
+ return transposedDataGrid.map((_, rowIndex) => {
51
+ return labels[rowIndex] != null
52
+ ? labels[rowIndex]
53
+ : createDefaultSeriesLabel(chartType, rowIndex)
54
+ })
55
+ }
56
+
57
+ export function createMultiGridSeriesLabels ({ transposedDataGrid, dataFormatter, chartType = 'multiGrid', gridIndex = 0 }: {
58
+ transposedDataGrid: DataGridDatum[][],
59
+ dataFormatter: DataFormatterGrid
60
+ chartType?: ChartType
61
+ gridIndex?: number
62
+ }) {
63
+ const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
64
+ ? dataFormatter.grid.gridData.rowLabels
65
+ : dataFormatter.grid.gridData.columnLabels
66
+ return transposedDataGrid.map((_, rowIndex) => {
67
+ return labels[rowIndex] != null
68
+ ? labels[rowIndex]
69
+ : createDefaultSeriesLabel(`${chartType}_grid${gridIndex}`, rowIndex)
70
+ })
71
+ }
72
+
73
+ export function createGridGroupLabels ({ transposedDataGrid, dataFormatter, chartType = 'grid' }: {
74
+ transposedDataGrid: DataGridDatum[][],
75
+ dataFormatter: DataFormatterGrid
76
+ chartType?: ChartType
77
+ }) {
78
+ if (transposedDataGrid[0] == null) {
79
+ return []
80
+ }
81
+ const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
82
+ ? dataFormatter.grid.gridData.columnLabels
83
+ : dataFormatter.grid.gridData.rowLabels
84
+ return transposedDataGrid[0].map((_, columnLabels) => {
85
+ return labels[columnLabels] != null
86
+ ? labels[columnLabels]
87
+ : createDefaultGroupLabel(chartType, columnLabels)
88
+ })
89
+ }
90
+
91
+ export function createMultiGridGroupLabels ({ transposedDataGrid, dataFormatter, chartType = 'multiGrid', gridIndex = 0 }: {
92
+ transposedDataGrid: DataGridDatum[][],
93
+ dataFormatter: DataFormatterGrid
94
+ chartType?: ChartType
95
+ gridIndex?: number
96
+ }) {
97
+ if (transposedDataGrid[0] == null) {
98
+ return []
99
+ }
100
+ const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
101
+ ? dataFormatter.grid.gridData.columnLabels
102
+ : dataFormatter.grid.gridData.rowLabels
103
+ return transposedDataGrid[0].map((_, columnLabels) => {
104
+ return labels[columnLabels] != null
105
+ ? labels[columnLabels]
106
+ : createDefaultGroupLabel(`${chartType}_grid${gridIndex}`, columnLabels)
107
+ })
108
+ }
109
+
110
+ // 取得最小及最大值 - 數字陣列
111
+ export function getMinAndMax (data: number[]): [number, number] {
112
+ const defaultMinAndMax: [number, number] = [0, 0] // default
113
+ if (!data.length) {
114
+ return defaultMinAndMax
115
+ }
116
+ const minAndMax: [number, number] = data.reduce((prev, current) => {
117
+ // [min, max]
118
+ return [
119
+ current < prev[0] ? current : prev[0],
120
+ current > prev[1] ? current : prev[1]
121
+ ]
122
+ }, [data[0], data[0]])
123
+ return minAndMax
124
+ }
125
+
126
+ // 取得最小及最大值 - datum格式陣列資料
127
+ export function getMinAndMaxValue (data: DatumValue[]): [number, number] {
128
+ const arr = data
129
+ .filter(d => d != null && d.value != null)
130
+ .map(d => d.value )
131
+ return getMinAndMax(arr)
132
+ }
133
+
134
+ // 取得最小及最大值 - Series Data
135
+ export function getMinAndMaxSeries (data: DataSeries): [number, number] {
136
+ const flatData: (DataSeriesValue | DataSeriesDatum)[] = data[0] && Array.isArray((data as (DataSeriesValue | DataSeriesDatum)[][])[0])
137
+ ? data.flat()
138
+ : data as (DataSeriesValue | DataSeriesDatum)[]
139
+ const arr = flatData
140
+ .filter(d => (d == null || (isPlainObject(d) && (d as DataSeriesDatum).value == null)) === false) // 過濾掉null &
141
+ .map(d => typeof d === 'number' ? d : d.value )
142
+ return getMinAndMax(arr)
143
+ }
144
+
145
+ // 取得最小及最大值 - Grid Data
146
+ export function getMinAndMaxGrid (data: DataGrid): [number, number] {
147
+ const flatData: (DataGridValue | DataGridDatum)[] = data.flat()
148
+ const arr = flatData
149
+ .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
150
+ .map(d => typeof d === 'number' ? d : d.value )
151
+ return getMinAndMax(arr)
152
+ }
153
+
154
+ // 取得最小及最大值 - MultiGrid Data
155
+ export function getMinAndMaxMultiGrid (data: DataMultiGrid): [number, number] {
156
+ const flatData: (DataGridValue | DataGridDatum)[] = data.flat().flat()
157
+ const arr = flatData
158
+ .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
159
+ .map(d => typeof d === 'number' ? d : d.value )
160
+ return getMinAndMax(arr)
161
+ }
162
+
163
+ // 取得最小及最大值 - MultiValue Data
164
+ export function getMinAndMaxMultiValue (data: DataMultiValue, valueIndex: number = 2): [number, number] {
165
+ const flatData: (DataMultiValueDatum | DataMultiValueValue)[] = data.flat().filter((d, i) => i == valueIndex)
166
+ const arr = flatData
167
+ .filter(d => (d == null || (isPlainObject(d) && (d as DataMultiValueDatum).value == null)) === false) // 過濾掉null
168
+ .map(d => typeof d === 'number' ? d : d.value )
169
+ return getMinAndMax(arr)
170
+ }
171
+
172
+ // @Q@ 待處理
173
+ // // 取得最小及最大值 - Relationship Data
174
+ // export function getMinAndMaxRelationship (data: DataRelationship, target: 'nodes' | 'edges' = 'nodes'): [number, number] {
175
+
176
+ // }
177
+
178
+ // @Q@ 待處理
179
+ // // 取得最小及最大值 - Tree Data
180
+ // export function getMinAndMaxTree (data: DataTree): [number, number] {
181
+
182
+ // }
183
+
184
+ // 轉置成seriesDirection為main的陣列格式
185
+ export function transposeData<T> (seriesDirection: SeriesDirection, data: T[][]): T[][] {
186
+ if (seriesDirection === 'row') {
187
+ return Object.assign([], data)
188
+ }
189
+ // 取得原始陣列的維度
190
+ const rows = data.length;
191
+ const cols = data.reduce((prev, current) => {
192
+ return Math.max(prev, current.length)
193
+ }, 0)
194
+
195
+ // 初始化轉換後的陣列
196
+ const transposedArray = new Array(cols).fill(null).map(() => new Array(rows).fill(null))
197
+
198
+ // 遍歷原始陣列,進行轉換
199
+ for (let i = 0; i < rows; i++) {
200
+ for (let j = 0; j < cols; j++) {
201
+ transposedArray[j][i] = data[i][j]
202
+ }
203
+ }
204
+
205
+ return transposedArray
206
+ }
207
+
208
+
209
+ export function seriesColorPredicate (seriesIndex: number, chartParams: ChartParams) {
210
+ return seriesIndex < chartParams.colors[chartParams.colorScheme].series.length
211
+ ? chartParams.colors[chartParams.colorScheme].series[seriesIndex]
212
+ : chartParams.colors[chartParams.colorScheme].series[
213
+ seriesIndex % chartParams.colors[chartParams.colorScheme].series.length
214
+ ]
215
+ }
216
+
217
+ export function calcGridContainerPosition (layout: Layout, container: DataFormatterGridContainer, rowIndex: number, columnIndex: number) {
218
+ const { gap, rowAmount, columnAmount } = container
219
+ const width = (layout.width - (gap * (columnAmount - 1))) / columnAmount
220
+ const height = (layout.height - (gap * (rowAmount - 1))) / rowAmount
221
+ const x = columnIndex * width + (columnIndex * gap)
222
+ const y = rowIndex * height + (rowIndex * gap)
223
+ const translate: [number, number] = [x, y]
224
+ const scale: [number, number] = [width / layout.width, height / layout.height]
225
+
226
+ return {
227
+ translate,
228
+ scale
229
+ }
230
+ }
231
+
232
+ // // multiGrid datum color
233
+ // export function multiGridColorPredicate ({ seriesIndex, groupIndex, data, chartParams }: {
234
+ // seriesIndex: number
235
+ // groupIndex: number
236
+ // data: ComputedDataMultiGrid
237
+ // chartParams: ChartParams
238
+ // }) {
239
+ // // 累加前面的grid的seriesIndex
240
+ // const accSeriesIndex = data.reduce((prev, current) => {
241
+ // if (current[0] && current[0][0] && groupIndex > current[0][0].gridIndex) {
242
+ // return prev + current[0].length
243
+ // } else if (current[0] && current[0][0] && groupIndex == current[0][0].gridIndex) {
244
+ // return prev + seriesIndex
245
+ // } else {
246
+ // return prev
247
+ // }
248
+ // }, 0)
249
+
250
+ // return seriesColorPredicate(accSeriesIndex, chartParams)
251
+ // }
252
+
253
+
package/tsconfig.json CHANGED
@@ -1,14 +1,14 @@
1
- {
2
- "compilerOptions": {
3
- "outDir": "./dist/",
4
- "sourceMap": true,
5
- "noImplicitAny": true,
6
- "module": "es6",
7
- "target": "es5",
8
- "jsx": "react",
9
- "allowJs": true,
10
- "moduleResolution": "node",
11
- "allowSyntheticDefaultImports" : true,
12
- "esModuleInterop" : true
13
- }
1
+ {
2
+ "compilerOptions": {
3
+ "outDir": "./dist/",
4
+ "sourceMap": true,
5
+ "noImplicitAny": true,
6
+ "module": "es6",
7
+ "target": "es5",
8
+ "jsx": "react",
9
+ "allowJs": true,
10
+ "moduleResolution": "node",
11
+ "allowSyntheticDefaultImports" : true,
12
+ "esModuleInterop" : true
13
+ }
14
14
  }
package/vite.config.js CHANGED
@@ -1,45 +1,45 @@
1
- // import { fileURLToPath, URL } from 'node:url'
2
-
3
- // import { resolve } from 'path'
4
- import { defineConfig } from 'vite'
5
- import dts from 'vite-plugin-dts'
6
-
7
- const releaseConfig = {
8
- plugins: [
9
- dts({
10
- insertTypesEntry: true
11
- })
12
- ],
13
- compilerOptions: {
14
- composite: true
15
- },
16
- build: {
17
- lib: {
18
- entry: "src/index.ts",
19
- name: 'orbcharts-core',
20
- formats: ["es", "umd"],
21
- fileName: format => `orbcharts-core.${format}.js`
22
- },
23
- // rollupOptions: {
24
- // input: {
25
- // main: resolve(__dirname, "src/index.ts")
26
- // },
27
- // external: ['vue'],
28
- // output: {
29
- // assetFileNames: 'my-library.css',
30
- // exports: "named",
31
- // globals: {
32
- // vue: 'Vue',
33
- // },
34
- // },
35
- // },
36
- }
37
- }
38
-
39
- export default defineConfig(({ command, mode }) => {
40
- if (mode === 'release') {
41
- return releaseConfig
42
- } else {
43
- return releaseConfig
44
- }
1
+ // import { fileURLToPath, URL } from 'node:url'
2
+
3
+ // import { resolve } from 'path'
4
+ import { defineConfig } from 'vite'
5
+ import dts from 'vite-plugin-dts'
6
+
7
+ const releaseConfig = {
8
+ plugins: [
9
+ dts({
10
+ insertTypesEntry: true
11
+ })
12
+ ],
13
+ compilerOptions: {
14
+ composite: true
15
+ },
16
+ build: {
17
+ lib: {
18
+ entry: "src/index.ts",
19
+ name: 'orbcharts-core',
20
+ formats: ["es", "umd"],
21
+ fileName: format => `orbcharts-core.${format}.js`
22
+ },
23
+ // rollupOptions: {
24
+ // input: {
25
+ // main: resolve(__dirname, "src/index.ts")
26
+ // },
27
+ // external: ['vue'],
28
+ // output: {
29
+ // assetFileNames: 'my-library.css',
30
+ // exports: "named",
31
+ // globals: {
32
+ // vue: 'Vue',
33
+ // },
34
+ // },
35
+ // },
36
+ }
37
+ }
38
+
39
+ export default defineConfig(({ command, mode }) => {
40
+ if (mode === 'release') {
41
+ return releaseConfig
42
+ } else {
43
+ return releaseConfig
44
+ }
45
45
  })