@orbcharts/core 3.0.0-alpha.32 → 3.0.0-alpha.34

package/src/utils/orbchartsUtils.ts

@@ -6,13 +6,14 @@ import type { DataSeries, DataSeriesDatum, DataSeriesValue } from '../types/Data
 import type { DataGrid, DataGridDatum, DataGridValue } from '../types/DataGrid'
 import type { DataMultiGrid } from '../types/DataMultiGrid'
 import type { DataMultiValue, DataMultiValueDatum, DataMultiValueValue } from '../types/DataMultiValue'
-import type { SeriesType, DataFormatterGrid } from '../types/DataFormatterGrid'
+import type { SeriesDirection, DataFormatterGrid, DataFormatterGridContainer } from '../types/DataFormatterGrid'
 import type { ComputedDatumSeriesValue } from '../types/ComputedData'
 import type { ComputedDatumSeries } from '../types/ComputedDataSeries'
 import type { ComputedDatumGrid, ComputedDataGrid } from '../types/ComputedDataGrid'
 import type { ComputedDataMultiGrid } from '../types/ComputedDataMultiGrid'
+import type { Layout } from '../types/Layout'
 // import type { ComputedDatumMultiGrid } from '../types/ComputedDataMultiGrid'
-import { isObject } from './commonUtils'
+import { isPlainObject } from './commonUtils'
 
 export function formatValueToLabel (value: any, valueFormatter: string | ((text: d3.NumberValue) => string)) {
   if (valueFormatter! instanceof Function == true) {
@@ -43,9 +44,9 @@ export function createGridSeriesLabels ({ transposedDataGrid, dataFormatter, cha
   chartType?: ChartType
   gridIndex?: number
 }) {
-  const labels = dataFormatter.grid.seriesType === 'row'
-    ? dataFormatter.grid.rowLabels
-    : dataFormatter.grid.columnLabels
+  const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
+    ? dataFormatter.grid.gridData.rowLabels
+    : dataFormatter.grid.gridData.columnLabels
   return transposedDataGrid.map((_, rowIndex) => {
     return labels[rowIndex] != null
       ? labels[rowIndex]
@@ -62,9 +63,9 @@ export function createGridGroupLabels ({ transposedDataGrid, dataFormatter, char
   if (transposedDataGrid[0] == null) {
     return []
   }
-  const labels = dataFormatter.grid.seriesType === 'row'
-    ? dataFormatter.grid.columnLabels
-    : dataFormatter.grid.rowLabels
+  const labels = dataFormatter.grid.gridData.seriesDirection === 'row'
+    ? dataFormatter.grid.gridData.columnLabels
+    : dataFormatter.grid.gridData.rowLabels
   return transposedDataGrid[0].map((_, columnLabels) => {
     return labels[columnLabels] != null
       ? labels[columnLabels]
@@ -102,7 +103,7 @@ export function getMinAndMaxSeries (data: DataSeries): [number, number] {
     ? data.flat()
     : data as (DataSeriesValue | DataSeriesDatum)[]
   const arr = flatData
-    .filter(d => (d == null || (isObject(d) && (d as DataSeriesDatum).value == null)) === false) // 過濾掉null &
+    .filter(d => (d == null || (isPlainObject(d) && (d as DataSeriesDatum).value == null)) === false) // 過濾掉null &
     .map(d => typeof d === 'number' ? d : d.value )
   return getMinAndMax(arr)
 }
@@ -111,7 +112,7 @@ export function getMinAndMaxSeries (data: DataSeries): [number, number] {
 export function getMinAndMaxGrid (data: DataGrid): [number, number] {
   const flatData: (DataGridValue | DataGridDatum)[] = data.flat()
   const arr = flatData
-    .filter(d => (d == null || (isObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
+    .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
     .map(d => typeof d === 'number' ? d : d.value )
   return getMinAndMax(arr)
 }
@@ -120,7 +121,7 @@ export function getMinAndMaxGrid (data: DataGrid): [number, number] {
 export function getMinAndMaxMultiGrid (data: DataMultiGrid): [number, number] {
   const flatData: (DataGridValue | DataGridDatum)[] = data.flat().flat()
   const arr = flatData
-    .filter(d => (d == null || (isObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
+    .filter(d => (d == null || (isPlainObject(d) && (d as DataGridDatum).value == null)) === false) // 過濾掉null
     .map(d => typeof d === 'number' ? d : d.value )
   return getMinAndMax(arr)
 }
@@ -129,7 +130,7 @@ export function getMinAndMaxMultiGrid (data: DataMultiGrid): [number, number] {
 export function getMinAndMaxMultiValue (data: DataMultiValue, valueIndex: number = 2): [number, number] {
   const flatData: (DataMultiValueDatum | DataMultiValueValue)[] = data.flat().filter((d, i) => i == valueIndex)
   const arr = flatData
-    .filter(d => (d == null || (isObject(d) && (d as DataMultiValueDatum).value == null)) === false) // 過濾掉null
+    .filter(d => (d == null || (isPlainObject(d) && (d as DataMultiValueDatum).value == null)) === false) // 過濾掉null
     .map(d => typeof d === 'number' ? d : d.value )
   return getMinAndMax(arr)
 }
@@ -146,9 +147,9 @@ export function getMinAndMaxMultiValue (data: DataMultiValue, valueIndex: number
 
 // }
 
-// 轉置成seriesType為main的陣列格式
-export function transposeData<T> (seriesType: SeriesType, data: T[][]): T[][] {
-  if (seriesType === 'row') {
+// 轉置成seriesDirection為main的陣列格式
+export function transposeData<T> (seriesDirection: SeriesDirection, data: T[][]): T[][] {
+  if (seriesDirection === 'row') {
     return Object.assign([], data)
   }
   // 取得原始陣列的維度
@@ -179,6 +180,21 @@ export function seriesColorPredicate (seriesIndex: number, chartParams: ChartPar
     ]
 }
 
+export function calcGridContainerPosition (layout: Layout, container: DataFormatterGridContainer, rowIndex: number, columnIndex: number) {
+  const { gap, rowAmount, columnAmount } = container
+  const width = (layout.width - (gap * (columnAmount - 1))) / columnAmount
+  const height = (layout.height - (gap * (rowAmount - 1))) / rowAmount
+  const x = columnIndex * width + (columnIndex * gap)
+  const y = rowIndex * height + (rowIndex * gap)
+  const translate: [number, number] = [x, y]
+  const scale: [number, number] = [width / layout.width, height / layout.height]
+
+  return {
+    translate,
+    scale
+  }
+}
+
 // // multiGrid datum color
 // export function multiGridColorPredicate ({ seriesIndex, groupIndex, data, chartParams }: {
 //   seriesIndex: number