@orbcharts/core 3.0.0-beta.3 → 3.0.0-beta.4

package/src/multiValue/contextObserverCallback.ts

@@ -1,12 +1,160 @@
-import type { ContextObserverCallback } from '../../lib/core-types'
-
-export const contextObserverCallback: ContextObserverCallback<'multiValue'> = ({ subject, observer }) => {
-
-  return {
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    fullDataFormatter$: observer.fullDataFormatter$,
-    computedData$: observer.computedData$,
-    layout$: observer.layout$,
-  }
-}
+import { map, shareReplay, distinctUntilChanged } from 'rxjs'
+import type { ContextObserverCallback, ContextObserverTypeMap } from '../../lib/core-types'
+import {
+  highlightObservable,
+  categoryDataMapObservable,
+  textSizePxObservable
+} from '../utils/observables'
+import {
+  multiValueComputedLayoutDataObservable,
+  // multiValueAxesTransformObservable,
+  // multiValueAxesReverseTransformObservable,
+  multiValueGraphicTransformObservable,
+  multiValueGraphicReverseScaleObservable,
+  multiValueCategoryLabelsObservable,
+  multiValueVisibleComputedDataObservable,
+  multiValueVisibleComputedLayoutDataObservable,
+  multiValueContainerPositionObservable,
+  minMaxXYObservable,
+  filteredMinMaxXYDataObservable
+} from '../utils/multiValueObservables'
+
+export const contextObserverCallback: ContextObserverCallback<'multiValue'> = ({ subject, observer }) => {
+
+  const textSizePx$ = textSizePxObservable(observer.fullChartParams$).pipe(
+    shareReplay(1)
+  )
+
+  const isCategorySeprate$ = observer.fullDataFormatter$.pipe(
+    map(d => d.separateCategory),
+    distinctUntilChanged(),
+    shareReplay(1)
+  )
+  
+  const multiValueContainerPosition$ = multiValueContainerPositionObservable({
+    computedData$: observer.computedData$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    layout$: observer.layout$,
+  })
+
+  // const multiValueAxesSize$ = multiValueAxesSizeObservable({
+  //   fullDataFormatter$: observer.fullDataFormatter$,
+  //   layout$: observer.layout$
+  // }).pipe(
+  //   shareReplay(1)
+  // )
+
+  const datumList$ = observer.computedData$.pipe(
+    map(d => d.flat().flat())
+  ).pipe(
+    shareReplay(1)
+  )
+
+  const multiValueHighlight$ = highlightObservable({
+    datumList$,
+    fullChartParams$: observer.fullChartParams$,
+    event$: subject.event$
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const categoryLabels$ = multiValueCategoryLabelsObservable({
+    computedData$: observer.computedData$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+  })
+
+  const CategoryDataMap$ = categoryDataMapObservable({
+    datumList$: datumList$
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const minMaxXY$ = minMaxXYObservable({
+    computedData$: observer.computedData$
+  }).pipe(
+    shareReplay(1)
+  )
+
+
+  const computedLayoutData$ = multiValueComputedLayoutDataObservable({
+    computedData$: observer.computedData$,
+    minMaxXY$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    layout$: observer.layout$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const visibleComputedData$ = multiValueVisibleComputedDataObservable({
+    computedData$: observer.computedData$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const visibleComputedLayoutData$ = multiValueVisibleComputedLayoutDataObservable({
+    computedLayoutData$: computedLayoutData$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const filteredMinMaxXYData$ = filteredMinMaxXYDataObservable({
+    visibleComputedLayoutData$: visibleComputedLayoutData$,
+    minMaxXY$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+  }).pipe(
+    shareReplay(1)
+  )
+
+  // const multiValueAxesTransform$ = multiValueAxesTransformObservable({
+  //   fullDataFormatter$: observer.fullDataFormatter$,
+  //   layout$: observer.layout$
+  // }).pipe(
+  //   shareReplay(1)
+  // )
+
+  // const multiValueAxesReverseTransform$ = multiValueAxesReverseTransformObservable({
+  //   multiValueAxesTransform$
+  // }).pipe(
+  //   shareReplay(1)
+  // )
+  
+  const multiValueGraphicTransform$ = multiValueGraphicTransformObservable({
+    minMaxXY$,
+    filteredMinMaxXYData$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    layout$: observer.layout$
+  }).pipe(
+    shareReplay(1)
+  )
+
+  const multiValueGraphicReverseScale$ = multiValueGraphicReverseScaleObservable({
+    multiValueContainerPosition$: multiValueContainerPosition$,
+    // multiValueAxesTransform$: multiValueAxesTransform$,
+    multiValueGraphicTransform$: multiValueGraphicTransform$,
+  })
+
+
+  return <ContextObserverTypeMap<'multiValue', any>>{
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    computedData$: observer.computedData$,
+    layout$: observer.layout$,
+    textSizePx$,
+    isCategorySeprate$,
+    multiValueContainerPosition$,
+    // multiValueAxesSize$,
+    multiValueHighlight$,
+    categoryLabels$,
+    CategoryDataMap$,
+    minMaxXY$,
+    computedLayoutData$,
+    visibleComputedData$,
+    visibleComputedLayoutData$,
+    filteredMinMaxXYData$,
+    // multiValueAxesTransform$,
+    // multiValueAxesReverseTransform$,
+    multiValueGraphicTransform$,
+    multiValueGraphicReverseScale$,
+  }
+}

package/src/multiValue/dataFormatterValidator.ts

@@ -1,10 +1,10 @@
-import type { DataFormatterValidator, DataFormatterTypeMap } from '../../lib/core-types'
-
-export const dataFormatterValidator: DataFormatterValidator<'multiValue'> = (dataFormatter: DataFormatterTypeMap<'multiValue'>) => {
-  
-  return {
-    status: 'success',
-    columnName: '',
-    expectToBe: ''
-  }
+import type { DataFormatterValidator, DataFormatterTypeMap } from '../../lib/core-types'
+
+export const dataFormatterValidator: DataFormatterValidator<'multiValue'> = (dataFormatter: DataFormatterTypeMap<'multiValue'>) => {
+  
+  return {
+    status: 'success',
+    columnName: '',
+    expectToBe: ''
+  }
 }

package/src/multiValue/dataValidator.ts

@@ -1,10 +1,10 @@
-import type { DataValidator, DataTypeMap } from '../../lib/core-types'
-
-export const dataValidator: DataValidator<'multiValue'> = (data: DataTypeMap<'multiValue'>) => {
-
-  return {
-    status: 'success',
-    columnName: '',
-    expectToBe: ''
-  }
+import type { DataValidator, DataTypeMap } from '../../lib/core-types'
+
+export const dataValidator: DataValidator<'multiValue'> = (data: DataTypeMap<'multiValue'>) => {
+
+  return {
+    status: 'success',
+    columnName: '',
+    expectToBe: ''
+  }
 }

package/src/relationship/computedDataFn.ts

@@ -1,125 +1,125 @@
-import type {
-  DataRelationshipObj,
-  DataRelationshipList,
-  Node,
-  Edge,
-  ComputedDataFn,
-  ComputedDataRelationship,
-  ComputedNode,
-  ComputedEdge
-} from '../../lib/core-types'
-
-export const computedDataFn: ComputedDataFn<'relationship'> = (context) => {
-  const { data, dataFormatter, chartParams } = context
-
-  let computedNodes: ComputedNode[] = []
-  let computedEdges: ComputedEdge[] = []
-
-  try {
-    // -- 取得nodes和edges資料 --
-    let nodes: Node[] = []
-    let edges: Edge[] = []
-    if ((data as DataRelationshipObj).nodes) {
-      nodes = (data as DataRelationshipObj).nodes
-      edges = (data as DataRelationshipObj).edges
-    } else if ((data as DataRelationshipList)[0]) {
-      nodes = (data as DataRelationshipList)[0]
-      edges = (data as DataRelationshipList)[1]
-    } else {
-      // 無值直接回傳
-      return {
-        nodes: [],
-        edges: []
-      } as ComputedDataRelationship
-    }
-
-    // -- nodes --
-    computedNodes = nodes.map((node, i) => {
-      const computedNode: ComputedNode = {
-        id: node.id,
-        index: i,
-        label: node.label ?? '',
-        description: node.description ?? '',
-        // tooltipContent: node.tooltipContent ? node.tooltipContent : dataFormatter.tooltipContentFormat(node, 0, i, context), // 0代表node
-        data: node.data ?? {},
-        value: node.value ?? 0,
-        categoryIndex: 0, // @Q@ 未完成
-        categoryLabel: '', // @Q@ 未完成
-        color: '', // @Q@ 未完成
-        startNodes: [], // 後面再取得資料
-        startNodeIds: [], // 後面再取得資料
-        endNodes: [], // 後面再取得資料
-        endNodeIds: [], // 後面再取得資料
-        visible: true // 後面再取得資料
-      }
-      return computedNode
-    })
-
-    const NodesMap: Map<string, ComputedNode> = new Map(computedNodes.map(d => [d.id, d]))
-
-    // -- edges --
-    computedEdges = edges.map((edge, i) => {
-      const computedEdge: ComputedEdge = {
-        id: edge.id,
-        index: i,
-        label: edge.label ?? '',
-        description: edge.description ?? '',
-        // tooltipContent: edge.tooltipContent ? edge.tooltipContent : dataFormatter.tooltipContentFormat(edge, 1, i, context), // 1代表edge
-        data: edge.data ?? {},
-        value: edge.value ?? 0,
-        startNode: NodesMap.get(edge.start),
-        startNodeId: edge.start,
-        endNode: NodesMap.get(edge.end),
-        endNodeId: edge.end,
-        visible: true // 先給預設值
-      }
-
-      return computedEdge
-    })
-
-    const StartNodesMap: Map<string, ComputedNode[]> = (function () {
-      const _StartNodesMap = new Map()
-      computedEdges.forEach(edge => {
-        const startNodes: ComputedNode[] = _StartNodesMap.get(edge.endNodeId) ?? []
-        startNodes.push(edge.startNode)
-        _StartNodesMap.set(edge.endNodeId, startNodes)
-      })
-      return _StartNodesMap
-    })()
-    
-    const EndNodesMap: Map<string, ComputedNode[]> = (function () {
-      const _EndNodesMap = new Map()
-      computedEdges.forEach(edge => {
-        const endNodes: ComputedNode[] = _EndNodesMap.get(edge.startNodeId) ?? []
-        endNodes.push(edge.endNode)
-        _EndNodesMap.set(edge.startNodeId, endNodes)
-      })
-      return _EndNodesMap
-    })()
-
-    // -- 補齊nodes資料 --
-    Array.from(NodesMap).forEach(([nodeId, node]) => {
-      node.startNodes = StartNodesMap.get(nodeId)
-      node.startNodeIds = node.startNodes.map(d => d.id)
-      node.endNodes = EndNodesMap.get(nodeId)
-      node.endNodeIds = node.endNodes.map(d => d.id)
-      node.visible = dataFormatter.visibleFilter(node, context)
-    })
-
-    // -- 補齊edges資料 --
-    computedEdges = computedEdges.map(edge => {
-      edge.visible = edge.startNode.visible && edge.endNode.visible
-        ? true
-        : false
-      return edge
-    })
-  } catch (e) {
-    // console.error(e)
-    throw Error(e)
-  }
-
-  return {
-    nodes: computedNodes,
-    edges: computedEdges
-  }
-}
+import type {
+  DataRelationshipObj,
+  DataRelationshipList,
+  Node,
+  Edge,
+  ComputedDataFn,
+  ComputedDataRelationship,
+  ComputedNode,
+  ComputedEdge
+} from '../../lib/core-types'
+
+export const computedDataFn: ComputedDataFn<'relationship'> = (context) => {
+  const { data, dataFormatter, chartParams } = context
+
+  let computedNodes: ComputedNode[] = []
+  let computedEdges: ComputedEdge[] = []
+
+  try {
+    // -- 取得nodes和edges資料 --
+    let nodes: Node[] = []
+    let edges: Edge[] = []
+    if ((data as DataRelationshipObj).nodes) {
+      nodes = (data as DataRelationshipObj).nodes
+      edges = (data as DataRelationshipObj).edges
+    } else if ((data as DataRelationshipList)[0]) {
+      nodes = (data as DataRelationshipList)[0]
+      edges = (data as DataRelationshipList)[1]
+    } else {
+      // 無值直接回傳
+      return {
+        nodes: [],
+        edges: []
+      } as ComputedDataRelationship
+    }
+
+    // -- nodes --
+    computedNodes = nodes.map((node, i) => {
+      const computedNode: ComputedNode = {
+        id: node.id,
+        index: i,
+        label: node.label ?? '',
+        description: node.description ?? '',
+        // tooltipContent: node.tooltipContent ? node.tooltipContent : dataFormatter.tooltipContentFormat(node, 0, i, context), // 0代表node
+        data: node.data ?? {},
+        value: node.value ?? 0,
+        categoryIndex: 0, // @Q@ 未完成
+        categoryLabel: '', // @Q@ 未完成
+        color: '', // @Q@ 未完成
+        startNodes: [], // 後面再取得資料
+        startNodeIds: [], // 後面再取得資料
+        endNodes: [], // 後面再取得資料
+        endNodeIds: [], // 後面再取得資料
+        visible: true // 後面再取得資料
+      }
+      return computedNode
+    })
+
+    const NodesMap: Map<string, ComputedNode> = new Map(computedNodes.map(d => [d.id, d]))
+
+    // -- edges --
+    computedEdges = edges.map((edge, i) => {
+      const computedEdge: ComputedEdge = {
+        id: edge.id,
+        index: i,
+        label: edge.label ?? '',
+        description: edge.description ?? '',
+        // tooltipContent: edge.tooltipContent ? edge.tooltipContent : dataFormatter.tooltipContentFormat(edge, 1, i, context), // 1代表edge
+        data: edge.data ?? {},
+        // value: edge.value ?? 0,
+        startNode: NodesMap.get(edge.start),
+        startNodeId: edge.start,
+        endNode: NodesMap.get(edge.end),
+        endNodeId: edge.end,
+        visible: true // 先給預設值
+      }
+
+      return computedEdge
+    })
+
+    const StartNodesMap: Map<string, ComputedNode[]> = (function () {
+      const _StartNodesMap = new Map()
+      computedEdges.forEach(edge => {
+        const startNodes: ComputedNode[] = _StartNodesMap.get(edge.endNodeId) ?? []
+        startNodes.push(edge.startNode)
+        _StartNodesMap.set(edge.endNodeId, startNodes)
+      })
+      return _StartNodesMap
+    })()
+    
+    const EndNodesMap: Map<string, ComputedNode[]> = (function () {
+      const _EndNodesMap = new Map()
+      computedEdges.forEach(edge => {
+        const endNodes: ComputedNode[] = _EndNodesMap.get(edge.startNodeId) ?? []
+        endNodes.push(edge.endNode)
+        _EndNodesMap.set(edge.startNodeId, endNodes)
+      })
+      return _EndNodesMap
+    })()
+
+    // -- 補齊nodes資料 --
+    Array.from(NodesMap).forEach(([nodeId, node]) => {
+      node.startNodes = StartNodesMap.get(nodeId)
+      node.startNodeIds = node.startNodes.map(d => d.id)
+      node.endNodes = EndNodesMap.get(nodeId)
+      node.endNodeIds = node.endNodes.map(d => d.id)
+      node.visible = dataFormatter.visibleFilter(node, context)
+    })
+
+    // -- 補齊edges資料 --
+    computedEdges = computedEdges.map(edge => {
+      edge.visible = edge.startNode.visible && edge.endNode.visible
+        ? true
+        : false
+      return edge
+    })
+  } catch (e) {
+    // console.error(e)
+    throw Error(e)
+  }
+
+  return {
+    nodes: computedNodes,
+    edges: computedEdges
+  }
+}

package/src/relationship/contextObserverCallback.ts

@@ -1,12 +1,12 @@
-import type { ContextObserverCallback } from '../../lib/core-types'
-
-export const contextObserverCallback: ContextObserverCallback<'relationship'> = ({ subject, observer }) => {
-
-  return {
-    fullParams$: observer.fullParams$,
-    fullChartParams$: observer.fullChartParams$,
-    fullDataFormatter$: observer.fullDataFormatter$,
-    computedData$: observer.computedData$,
-    layout$: observer.layout$,
-  }
-}
+import type { ContextObserverCallback } from '../../lib/core-types'
+
+export const contextObserverCallback: ContextObserverCallback<'relationship'> = ({ subject, observer }) => {
+
+  return {
+    fullParams$: observer.fullParams$,
+    fullChartParams$: observer.fullChartParams$,
+    fullDataFormatter$: observer.fullDataFormatter$,
+    computedData$: observer.computedData$,
+    layout$: observer.layout$,
+  }
+}

package/src/relationship/dataFormatterValidator.ts

@@ -1,10 +1,10 @@
-import type { DataFormatterValidator, DataFormatterTypeMap } from '../../lib/core-types'
-
-export const dataFormatterValidator: DataFormatterValidator<'relationship'> = (dataFormatter: DataFormatterTypeMap<'relationship'>) => {
-  
-  return {
-    status: 'success',
-    columnName: '',
-    expectToBe: ''
-  }
+import type { DataFormatterValidator, DataFormatterTypeMap } from '../../lib/core-types'
+
+export const dataFormatterValidator: DataFormatterValidator<'relationship'> = (dataFormatter: DataFormatterTypeMap<'relationship'>) => {
+  
+  return {
+    status: 'success',
+    columnName: '',
+    expectToBe: ''
+  }
 }

package/src/relationship/dataValidator.ts

@@ -1,10 +1,10 @@
-import type { DataValidator, DataTypeMap } from '../../lib/core-types'
-
-export const dataValidator: DataValidator<'relationship'> = (data: DataTypeMap<'relationship'>) => {
-
-  return {
-    status: 'success',
-    columnName: '',
-    expectToBe: ''
-  }
+import type { DataValidator, DataTypeMap } from '../../lib/core-types'
+
+export const dataValidator: DataValidator<'relationship'> = (data: DataTypeMap<'relationship'>) => {
+
+  return {
+    status: 'success',
+    columnName: '',
+    expectToBe: ''
+  }
 }