@orbcharts/plugins-basic 3.0.0-alpha.54 → 3.0.0-alpha.56

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orbcharts/plugins-basic",
-  "version": "3.0.0-alpha.54",
+  "version": "3.0.0-alpha.56",
   "description": "plugins for OrbCharts",
   "author": "Blue Planet Inc.",
   "license": "Apache-2.0",
@@ -35,7 +35,7 @@
     "vite-plugin-dts": "^3.7.3"
   },
   "dependencies": {
-    "@orbcharts/core": "^3.0.0-alpha.50",
+    "@orbcharts/core": "^3.0.0-alpha.52",
     "d3": "^7.8.5",
     "rxjs": "^7.8.1"
   }

package/src/grid/defaults.ts

@@ -41,6 +41,7 @@ export const DEFAULT_GROUP_AREA_PARAMS: GroupAuxParams = {
   labelTextFormat: text => text,
   labelPadding: 24,
 }
+DEFAULT_GROUP_AREA_PARAMS.labelTextFormat.toString = () => `text => text`
 
 export const DEFAULT_BARS_PARAMS: BarsParams = {
   // barType: 'rect',
@@ -83,6 +84,7 @@ export const DEFAULT_GROUP_AXIS_PARAMS: GroupAxisParams = {
   tickTextRotate: 0,
   tickTextColorType: 'primary',
 }
+DEFAULT_GROUP_AXIS_PARAMS.tickFormat.toString = () => `text => text`
 
 export const DEFAULT_VALUE_AXIS_PARAMS: ValueAxisParams = {
   // labelAnchor: 'end',

package/src/multiGrid/defaults.ts

@@ -50,6 +50,7 @@ export const DEFAULT_MULTI_GROUP_AXIS_PARAMS: MultiGroupAxisParams = {
   tickTextColorType: 'primary',
   gridIndexes: [0]
 }
+DEFAULT_MULTI_GROUP_AXIS_PARAMS.tickFormat.toString = () => `text => text`
 
 export const DEFAULT_MULTI_VALUE_AXIS_PARAMS: MultiValueAxisParams = {
   // labelAnchor: 'end',

package/src/multiGrid/plugins/OverlappingValueAxes.ts

@@ -50,15 +50,16 @@ export const OverlappingValueAxes = defineMultiGridPlugin(pluginName, DEFAULT_OV
       if (!data.fullDataFormatter.gridList[data.secondGridIndex]) {
         data.fullDataFormatter.gridList[data.secondGridIndex] = Object.assign({}, data.fullDataFormatter.gridList[data.firstGridIndex])
       }
+      const position = data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position
       // 反轉第二個valueAxis的位置
-      let reversePosition = ''
-      if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'left') {
+      let reversePosition = position
+      if (position === 'left') {
         reversePosition = 'right'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'bottom') {
+      } else if (position === 'bottom') {
         reversePosition = 'top'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'top') {
+      } else if (position === 'top') {
         reversePosition = 'bottom'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'right') {
+      } else if (position === 'right') {
         reversePosition = 'left'
       }
       return <DataFormatterGrid>{

package/src/multiGrid/plugins/OverlappingValueStackAxes.ts

@@ -51,15 +51,16 @@ export const OverlappingValueStackAxes = defineMultiGridPlugin(pluginName, DEFAU
       if (!data.fullDataFormatter.gridList[data.secondGridIndex]) {
         data.fullDataFormatter.gridList[data.secondGridIndex] = Object.assign({}, data.fullDataFormatter.gridList[data.firstGridIndex])
       }
+      const position = data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position
       // 反轉第二個valueAxis的位置
-      let reversePosition = ''
-      if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'left') {
+      let reversePosition = position
+      if (position === 'left') {
         reversePosition = 'right'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'bottom') {
+      } else if (position === 'bottom') {
         reversePosition = 'top'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'top') {
+      } else if (position === 'top') {
         reversePosition = 'bottom'
-      } else if (data.fullDataFormatter.gridList[data.firstGridIndex].valueAxis.position === 'right') {
+      } else if (position === 'right') {
         reversePosition = 'left'
       }
       return <DataFormatterGrid>{

package/src/noneData/defaults.ts

@@ -62,3 +62,42 @@ export const TOOLTIP_PARAMS: TooltipParams = {
   },
   svgRenderFn: null
 }
+TOOLTIP_PARAMS.textRenderFn.toString = () => `(eventData) => {
+  if (eventData.highlightTarget === 'datum' && eventData.datum) {
+    return [\`\${eventData.datum.label}: \${eventData.datum.value}\`]
+  } else if (eventData.highlightTarget === 'series') {
+    const label = (eventData as EventBaseSeriesValue<any, any>).seriesLabel
+    const valueArr = (eventData as EventBaseSeriesValue<any, any>).series
+      .filter(d => d.visible == true)
+      .map(d => {
+        return d.value
+      })
+    const value = valueArr.length > 5
+      ? valueArr.slice(0, 5).join(',') + '...'
+      : valueArr.join(',')
+    return [label, value]
+  } else if (eventData.highlightTarget === 'group') {
+    const label = (eventData as EventBaseGridValue<any, any>).groupLabel
+    const valueArr = (eventData as EventBaseGridValue<any, any>).series
+      .filter(d => d.visible == true)
+      .map(d => {
+        return d.value
+      })
+    const value = valueArr.length > 5
+      ? valueArr.slice(0, 5).join(',') + '...'
+      : valueArr.join(',')
+    return [label, value]
+  } else if (eventData.highlightTarget === 'category') {
+    const label = (eventData as EventBaseCategoryValue<any, any>).categoryLabel
+    const valueArr = (eventData as EventBaseCategoryValue<any, any>).category
+      .filter(d => d.visible == true)
+      .map(d => {
+        return d.value
+      })
+    const value = valueArr.length > 5
+      ? valueArr.slice(0, 5).join(',') + '...'
+      : valueArr.join(',')
+    return [label, value]
+  }
+  return []
+}`

package/src/series/defaults.ts

@@ -79,6 +79,22 @@ export const DEFAULT_PIE_EVENT_TEXTS_PARAMS: PieEventTextsParams = {
     }
   ]
 }
+DEFAULT_PIE_EVENT_TEXTS_PARAMS.eventFn.toString = () => `(eventData: EventSeries, eventName: EventName, t: number) => {
+  if (eventName === 'mouseover' || eventName === 'mousemove') {
+    return [String(eventData.datum!.value)]
+  }
+  return [
+    String(
+      Math.round(
+        eventData.data.reduce((acc, seriesData) => {
+          return acc + seriesData.reduce((_acc, data) => {
+            return _acc + (data.value ?? 0)
+          }, 0)
+        }, 0) * t
+      )
+    )
+  ]
+}`
 
 export const DEFAULT_PIE_LABELS_PARAMS: PieLabelsParams = {
   // solidColor: undefined,
@@ -94,6 +110,7 @@ export const DEFAULT_PIE_LABELS_PARAMS: PieLabelsParams = {
   labelColorType: 'primary',
   labelFn: d => String(d.label),
 }
+DEFAULT_PIE_LABELS_PARAMS.labelFn.toString = () => `d => String(d.label)`
 
 export const DEFAULT_ROSE_PARAMS: RoseParams = {
   outerRadius: 0.95,
@@ -109,6 +126,7 @@ export const DEFAULT_ROSE_LABELS_PARAMS: RoseLabelsParams = {
   labelColorType: 'primary',
   arcScaleType: 'area'
 }
+DEFAULT_ROSE_LABELS_PARAMS.labelFn.toString = () => `d => String(d.label)`
 
 export const DEFAULT_SERIES_LEGEND_PARAMS: SeriesLegendParams = {
   position: 'right',

package/src/tree/defaults.ts

@@ -7,6 +7,7 @@ export const DEFAULT_TREE_MAP_PARAMS: TreeMapParams = {
   squarifyRatio: 1.618034, // 黃金比例
   sort: (a, b) => b.value - a.value
 }
+DEFAULT_TREE_MAP_PARAMS.sort.toString = () => `(a, b) => b.value - a.value`
 
 export const DEFAULT_TREE_LEGEND_PARAMS: TreeLegendParams = {
   position: 'right',