@orbcharts/presets-basic 3.0.0-alpha.4 → 3.0.0-alpha.40

package/package.json

@@ -1,43 +1,43 @@
-{
-  "name": "@orbcharts/presets-basic",
-  "version": "3.0.0-alpha.4",
-  "description": "presets for OrbCharts",
-  "author": "Blue Planet Inc.",
-  "license": "Apache-2.0",
-  "keywords": [
-    "d3",
-    "rxjs",
-    "svg",
-    "visualization",
-    "infographic",
-    "graph",
-    "chart"
-  ],
-  "private": false,
-  "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org/"
-  },
-  "files": [
-    "*"
-  ],
-  "module": "./dist/orbcharts-presets-basic.es.js",
-  "types": "./dist/src/index.d.ts",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "vite build --mode release"
-  },
-  "devDependencies": {
-    "@types/d3": "^7.4.0",
-    "ts-loader": "^9.4.2",
-    "typescript": "^5.0.4",
-    "vite": "^5.3.5",
-    "vite-plugin-dts": "^3.7.3"
-  },
-  "dependencies": {
-    "@orbcharts/core": "^3.0.0-alpha.27",
-    "@orbcharts/plugins-basic": "^3.0.0-alpha.31",
-    "d3": "^7.8.5",
-    "rxjs": "^7.8.1"
-  }
-}
+{
+  "name": "@orbcharts/presets-basic",
+  "version": "3.0.0-alpha.40",
+  "description": "presets for OrbCharts",
+  "author": "Blue Planet Inc.",
+  "license": "Apache-2.0",
+  "keywords": [
+    "d3",
+    "rxjs",
+    "svg",
+    "visualization",
+    "infographic",
+    "graph",
+    "chart"
+  ],
+  "private": false,
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "*"
+  ],
+  "module": "./dist/orbcharts-presets-basic.es.js",
+  "types": "./dist/src/index.d.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "vite build --mode production"
+  },
+  "devDependencies": {
+    "@types/d3": "^7.4.0",
+    "ts-loader": "^9.4.2",
+    "typescript": "^5.0.4",
+    "vite": "^5.3.5",
+    "vite-plugin-dts": "^3.7.3"
+  },
+  "dependencies": {
+    "@orbcharts/core": "^3.0.0-alpha.61",
+    "@orbcharts/plugins-basic": "^3.0.0-alpha.69",
+    "d3": "^7.8.5",
+    "rxjs": "^7.8.1"
+  }
+}

package/src/grid/PRESET_BARS_HORIZONTAL_AND_ROUND.ts

@@ -0,0 +1,62 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetBarsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_BARS_HORIZONTAL_AND_ROUND: PresetPartial<'grid', PresetBarsParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetGridLegendParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_BARS_HORIZONTAL_AND_ROUND',
+  description: '橫向圓角長條圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 160
+    },
+  },
+  dataFormatter: {
+    grid: {
+      valueAxis: {
+        position: 'bottom'
+        // position: 'top'
+        // position: 'left'
+        // position: 'right'
+      },
+      groupAxis: {
+        position: 'left'
+        // position: 'right'
+        // position: 'bottom'
+        // position: 'top'
+      },
+    }
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Bars: {
+      barWidth: 0,
+      barPadding: 1,
+      barGroupPadding: 10,
+      barRadius: true,
+    },
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      // 底部圖例及圓弧列點
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectRadius: 7,
+    }
+  }
+}

package/src/grid/PRESET_BARS_HORIZONTAL_AND_THIN.ts

@@ -0,0 +1,59 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetBarsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_BARS_HORIZONTAL_AND_THIN: PresetPartial<'grid', PresetBarsParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetGridLegendParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_BARS_HORIZONTAL_AND_THIN',
+  description: '橫向細長長條圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 160
+    },
+  },
+  dataFormatter: {
+    grid: {
+      valueAxis: {
+        position: 'bottom'
+        // position: 'top'
+        // position: 'left'
+        // position: 'right'
+      },
+      groupAxis: {
+        position: 'left'
+        // position: 'right'
+        // position: 'bottom'
+        // position: 'top'
+      },
+    }
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Bars: {
+      barWidth: 20,
+      barPadding: 1,
+      barGroupPadding: 10
+    },
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_BARS_ROUND.ts

@@ -0,0 +1,46 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetBarsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_BARS_ROUND: PresetPartial<'grid', PresetBarsParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetGridLegendParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_BARS_ROUND',
+  description: '圓角長條圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Bars: {
+      barWidth: 0,
+      barPadding: 1,
+      barGroupPadding: 10,
+      barRadius: true,
+    },
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      // 底部圖例及圓弧列點
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectRadius: 7,
+    }
+  }
+}

package/src/grid/PRESET_BARS_THIN.ts

@@ -0,0 +1,43 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetBarsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_BARS_THIN: PresetPartial<'grid', PresetBarsParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetGridLegendParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_BARS_THIN',
+  description: '細長條圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Bars: {
+      barWidth: 20,
+      barPadding: 1,
+      barGroupPadding: 10
+    },
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_GRID_BASIC.ts

@@ -0,0 +1,25 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetGridPluginParams, PresetNoneDataPluginParams } from '../types'
+import { ALL_PLUGIN_PARAMS_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_GRID_BASIC: PresetPartial<'grid', PresetGridPluginParams & PresetNoneDataPluginParams> = {
+  name: 'PRESET_GRID_BASIC',
+  description: '基本Grid參數',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_GRID,
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_GRID_HORIZONTAL.ts

@@ -0,0 +1,42 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetGridPluginParams, PresetNoneDataPluginParams } from '../types'
+import { ALL_PLUGIN_PARAMS_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_GRID_HORIZONTAL: PresetPartial<'grid', PresetGridPluginParams & PresetNoneDataPluginParams> = {
+  name: 'PRESET_GRID_HORIZONTAL',
+  description: '橫向圖',
+  chartParams: {
+    // 間距下面及左邊留空
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 160
+    },
+  },
+  dataFormatter: {
+    grid: {
+      valueAxis: {
+        position: 'bottom'
+        // position: 'top'
+        // position: 'left'
+        // position: 'right'
+      },
+      groupAxis: {
+        position: 'left'
+        // position: 'right'
+        // position: 'bottom'
+        // position: 'top'
+      },
+    }
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_GRID,
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_GRID_PN_SCALE.ts

@@ -0,0 +1,33 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetGridPluginParams, PresetNoneDataPluginParams } from '../types'
+import { ALL_PLUGIN_PARAMS_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_GRID_PN_SCALE: PresetPartial<'grid', PresetGridPluginParams & PresetNoneDataPluginParams> = {
+  name: 'PRESET_GRID_PN_SCALE',
+  description: '正負值分向圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+  },
+  dataFormatter: {
+    grid: {
+      valueAxis: {
+        scaleDomain: ['auto', 'auto'],
+        scaleRange: [0.05, 0.95],
+      },
+    }
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_GRID,
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_GRID_ROTATE_AXIS_LABEL.ts

@@ -0,0 +1,33 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetGridPluginParams, PresetNoneDataPluginParams } from '../types'
+import { ALL_PLUGIN_PARAMS_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_GRID_ROTATE_AXIS_LABEL: PresetPartial<'grid', PresetGridPluginParams & PresetNoneDataPluginParams> = {
+  name: 'PRESET_GRID_ROTATE_AXIS_LABEL',
+  description: '傾斜標籤',
+  chartParams: {
+    // 間距下面加長留空
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 160,
+      left: 60
+    },
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_GRID,
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    GroupAux: {
+      labelRotate: -30
+    },
+    GroupAxis: {
+      tickPadding: 15,
+      tickTextRotate: -30
+    },
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_GRID_SEPARATE_SERIES.ts

@@ -0,0 +1,38 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetGridPluginParams, PresetNoneDataPluginParams } from '../types'
+import { ALL_PLUGIN_PARAMS_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_GRID_SEPARATE_SERIES: PresetPartial<'grid', PresetGridPluginParams & PresetNoneDataPluginParams> = {
+  name: 'PRESET_GRID_SEPARATE_SERIES',
+  description: '分開顯示Series',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 160,
+      left: 60
+    },
+  },
+  dataFormatter: {
+    grid: {
+      // seriesSlotIndexes: [0, 1],
+      separateSeries: true,
+    },
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_GRID,
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    GroupAux: {
+      labelRotate: -30
+    },
+    GroupAxis: {
+      tickPadding: 15,
+      tickTextRotate: -30
+    },
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+    }
+  }
+}

package/src/grid/PRESET_LINES_BASIC.ts

@@ -0,0 +1,44 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetLinesParams,
+  PresetDotsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_LINES_BASIC: PresetPartial<'grid', PresetLinesParams
+& PresetDotsParams
+& PresetGridLegendParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_LINES_BASIC',
+  description: '基本Lines參數',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+    highlightTarget: 'series'
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Lines: {},
+    Dots: {},
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectHeight: 2
+    }
+  }
+}

package/src/grid/PRESET_LINES_CURVE.ts

@@ -0,0 +1,47 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetLinesParams,
+  PresetDotsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_LINES_CURVE: PresetPartial<'grid', PresetLinesParams
+& PresetDotsParams
+& PresetGridLegendParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_LINES_CURVE',
+  description: '弧線折線圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+    highlightTarget: 'series'
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Lines: {
+      lineCurve: 'curveMonotoneX',
+      lineWidth: 3
+    },
+    Dots: {},
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectHeight: 2
+    }
+  }
+}

package/src/grid/PRESET_LINES_HIGHLIGHT_GROUP_DOTS.ts

@@ -0,0 +1,46 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetLinesParams,
+  PresetDotsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_LINES_HIGHLIGHT_GROUP_DOTS: PresetPartial<'grid', PresetLinesParams
+& PresetDotsParams
+& PresetGridLegendParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_LINES_HIGHLIGHT_GROUP_DOTS',
+  description: '折線圖及Highlight Group圓點',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 60
+    },
+    highlightTarget: 'group'
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Lines: {},
+    Dots: {
+      onlyShowHighlighted: false
+    },
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectHeight: 2
+    }
+  }
+}

package/src/grid/PRESET_LINES_HORIZONTAL.ts

@@ -0,0 +1,60 @@
+import type { PresetPartial } from '@orbcharts/core'
+import type { PresetLinesParams,
+  PresetDotsParams,
+  PresetGroupAxisParams,
+  PresetValueAxisParams,
+  PresetGroupAuxParams,
+  PresetGridLegendParams,
+  PresetNoneDataPluginParams
+} from '../types'
+import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
+
+export const PRESET_LINES_HORIZONTAL: PresetPartial<'grid', PresetLinesParams
+& PresetDotsParams
+& PresetGridLegendParams
+& PresetGroupAxisParams
+& PresetValueAxisParams
+& PresetGroupAuxParams
+& PresetNoneDataPluginParams> = {
+  name: 'PRESET_LINES_HORIZONTAL',
+  description: '橫向折線圖',
+  chartParams: {
+    padding: {
+      top: 60,
+      right: 60,
+      bottom: 120,
+      left: 160
+    },
+    highlightTarget: 'series'
+  },
+  dataFormatter: {
+    grid: {
+      valueAxis: {
+        position: 'bottom'
+        // position: 'top'
+        // position: 'left'
+        // position: 'right'
+      },
+      groupAxis: {
+        position: 'left'
+        // position: 'right'
+        // position: 'bottom'
+        // position: 'top'
+      },
+    }
+  },
+  allPluginParams: {
+    ...ALL_PLUGIN_PARAMS_NONE_DATA,
+    Lines: {},
+    Dots: {},
+    GroupAxis: {},
+    ValueAxis: {},
+    GroupAux: {},
+    GridLegend: {
+      position: 'bottom',
+      justify: 'center',
+      padding: 14,
+      listRectHeight: 2
+    }
+  }
+}