@orbcharts/presets-basic 3.0.0-beta.8 → 3.0.0

package/src/grid/index.ts

@@ -1,23 +1,27 @@
-export { PRESET_BARS_HORIZONTAL_AND_ROUND } from './PRESET_BARS_HORIZONTAL_AND_ROUND'
-export { PRESET_BARS_HORIZONTAL_AND_THIN } from './PRESET_BARS_HORIZONTAL_AND_THIN'
-export { PRESET_BARS_ROUND } from './PRESET_BARS_ROUND'
-export { PRESET_BARS_THIN } from './PRESET_BARS_THIN'
-export { PRESET_GRID_BASIC } from './PRESET_GRID_BASIC'
-export { PRESET_GRID_HORIZONTAL } from './PRESET_GRID_HORIZONTAL'
-export { PRESET_GRID_PN_SCALE } from './PRESET_GRID_PN_SCALE'
-export { PRESET_GRID_ROTATE_AXIS_LABEL } from './PRESET_GRID_ROTATE_AXIS_LABEL'
-export { PRESET_GRID_SEPARATE_SERIES } from './PRESET_GRID_SEPARATE_SERIES'
-export { PRESET_LINE_AREAS_BASIC } from './PRESET_LINE_AREAS_BASIC'
-export { PRESET_LINE_AREAS_CURVE } from './PRESET_LINE_AREAS_CURVE'
-// export { PRESET_LINE_AREAS_HIGHLIGHT_GROUP_DOTS } from './PRESET_LINE_AREAS_HIGHLIGHT_GROUP_DOTS'
-export { PRESET_LINE_AREAS_HORIZONTAL } from './PRESET_LINE_AREAS_HORIZONTAL'
-export { PRESET_LINE_AREAS_LOOSE_TICKS } from './PRESET_LINE_AREAS_LOOSE_TICKS'
-export { PRESET_LINE_AREAS_ROTATE_AXIS_LABEL } from './PRESET_LINE_AREAS_ROTATE_AXIS_LABEL'
-export { PRESET_LINE_AREAS_SEPARATE_SERIES } from './PRESET_LINE_AREAS_SEPARATE_SERIES'
-export { PRESET_LINES_BASIC } from './PRESET_LINES_BASIC'
-export { PRESET_LINES_CURVE } from './PRESET_LINES_CURVE'
-// export { PRESET_LINES_HIGHLIGHT_GROUP_DOTS } from './PRESET_LINES_HIGHLIGHT_GROUP_DOTS'
-export { PRESET_LINES_HORIZONTAL } from './PRESET_LINES_HORIZONTAL'
-export { PRESET_LINES_LOOSE_TICKS } from './PRESET_LINES_LOOSE_TICKS'
-export { PRESET_LINES_ROTATE_AXIS_LABEL } from './PRESET_LINES_ROTATE_AXIS_LABEL'
+export { PRESET_BARS_HORIZONTAL_AND_ROUND } from './PRESET_BARS_HORIZONTAL_AND_ROUND'
+export { PRESET_BARS_HORIZONTAL_AND_THIN } from './PRESET_BARS_HORIZONTAL_AND_THIN'
+export { PRESET_BARS_ROUND } from './PRESET_BARS_ROUND'
+export { PRESET_BARS_THIN } from './PRESET_BARS_THIN'
+export { PRESET_GRID_BASIC } from './PRESET_GRID_BASIC'
+export { PRESET_GRID_HORIZONTAL } from './PRESET_GRID_HORIZONTAL'
+export { PRESET_GRID_PN_SCALE_SIMPLE } from './PRESET_GRID_PN_SCALE_SIMPLE'
+export { PRESET_GRID_PN_SCALE } from './PRESET_GRID_PN_SCALE'
+export { PRESET_GRID_ROTATE_AXIS_LABEL } from './PRESET_GRID_ROTATE_AXIS_LABEL'
+export { PRESET_GRID_SEPARATE_SERIES } from './PRESET_GRID_SEPARATE_SERIES'
+export { PRESET_GRID_SIMPLE } from './PRESET_GRID_SIMPLE'
+export { PRESET_LINE_AREAS_BASIC } from './PRESET_LINE_AREAS_BASIC'
+export { PRESET_LINE_AREAS_CURVE } from './PRESET_LINE_AREAS_CURVE'
+// export { PRESET_LINE_AREAS_HIGHLIGHT_GROUP_DOTS } from './PRESET_LINE_AREAS_HIGHLIGHT_GROUP_DOTS'
+export { PRESET_LINE_AREAS_HORIZONTAL } from './PRESET_LINE_AREAS_HORIZONTAL'
+export { PRESET_LINE_AREAS_LOOSE_TICKS } from './PRESET_LINE_AREAS_LOOSE_TICKS'
+export { PRESET_LINE_AREAS_ROTATE_AXIS_LABEL } from './PRESET_LINE_AREAS_ROTATE_AXIS_LABEL'
+export { PRESET_LINE_AREAS_SEPARATE_SERIES } from './PRESET_LINE_AREAS_SEPARATE_SERIES'
+export { PRESET_LINE_AREAS_SIMPLE } from './PRESET_LINE_AREAS_SIMPLE'
+export { PRESET_LINES_BASIC } from './PRESET_LINES_BASIC'
+export { PRESET_LINES_CURVE } from './PRESET_LINES_CURVE'
+// export { PRESET_LINES_HIGHLIGHT_GROUP_DOTS } from './PRESET_LINES_HIGHLIGHT_GROUP_DOTS'
+export { PRESET_LINES_HORIZONTAL } from './PRESET_LINES_HORIZONTAL'
+export { PRESET_LINES_LOOSE_TICKS } from './PRESET_LINES_LOOSE_TICKS'
+export { PRESET_LINES_ROTATE_AXIS_LABEL } from './PRESET_LINES_ROTATE_AXIS_LABEL'
+export { PRESET_LINES_SIMPLE } from './PRESET_LINES_SIMPLE'
 export { PRESET_LINES_WITH_SOLID_DOTS } from './PRESET_LINES_WITH_SOLID_DOTS'

package/src/index.ts

@@ -1,6 +1,6 @@
-export * from './series'
-export * from './grid'
-export * from './multiGrid'
-export * from './multiValue'
-export * from './relationship'
-export * from './tree'
+export * from './series'
+export * from './grid'
+export * from './multiGrid'
+export * from './multiValue'
+export * from './relationship'
+export * from './tree'

package/src/multiGrid/PRESET_MULTI_GRID_BASIC.ts

@@ -1,38 +1,64 @@
-import type { PresetPartial } from '../../lib/core-types'
-import type { 
-  PresetMultiGridPluginParams,
-  PresetNoneDataPluginParams
-} from '../types'
-// import { ALL_PLUGIN_PARAMS_MULTI_GRID, ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
-
-export const PRESET_MULTI_GRID_BASIC: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
-& Partial<PresetNoneDataPluginParams>> = {
-  name: 'PRESET_MULTI_GRID_BASIC',
-  description: '基本MultiGrid參數',
-  chartParams: {
-    padding: {
-      top: 60,
-      right: 60,
-      bottom: 120,
-      left: 60
-    },
-    highlightTarget: 'series'
-  },
-  allPluginParams: {
-    // ...ALL_PLUGIN_PARAMS_MULTI_GRID,
-    // ...ALL_PLUGIN_PARAMS_NONE_DATA,
-    MultiGridLegend: {
-      // position: 'bottom',
-      // justify: 'center',
-      placement: 'bottom',
-      padding: 14,
-      gridList: [
-        {
-        },
-        {
-          listRectHeight: 2,
-        }
-      ]
-    }
-  }
-}
+import type { PresetPartial } from '../../lib/core-types'
+import type { 
+  PresetMultiGridPluginParams,
+  PresetNoneDataPluginParams
+} from '../types'
+
+export const PRESET_MULTI_GRID_BASIC: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
+& Partial<PresetNoneDataPluginParams>> = {
+  name: 'PRESET_MULTI_GRID_BASIC',
+  description: 'Basic MultiGrid',
+  descriptionZh: '基本MultiGrid',
+  chartParams: {
+    colors: {
+      light: {
+        label: [
+          "#0088FF",
+          "#16B59B",
+          "#6F3BD5",
+          "#EE5F13",
+          "#F9B052",
+          "#D4785A",
+          "#42C724",
+          "#FF4B4B",
+          "#1F3172",
+          "#E23D93"
+        ],
+      },
+      dark: {
+        label: [
+          "#4BABFF",
+          "#7DD3C4",
+          "#8454D4",
+          "#FF6C6C",
+          "#FAC77D",
+          "#D58C75",
+          "#42C724",
+          "#FF8B8B",
+          "#5366AC",
+          "#FF8DC8"
+        ]
+      }
+    },
+    padding: {
+      top: 40,
+      right: 40,
+      bottom: 100,
+      left: 80
+    },
+    highlightTarget: 'series'
+  },
+  pluginParams: {
+    MultiGridLegend: {
+      placement: 'bottom',
+      padding: 14,
+      gridList: [
+        {
+        },
+        {
+          listRectHeight: 2,
+        }
+      ]
+    }
+  }
+}

package/src/multiGrid/PRESET_MULTI_GRID_DIVERGING.ts

@@ -1,86 +1,112 @@
-import type { PresetPartial } from '../../lib/core-types'
-import type { 
-  PresetMultiGridPluginParams,
-  PresetNoneDataPluginParams
-} from '../types'
-import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
-
-export const PRESET_MULTI_GRID_DIVERGING: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
-& Partial<PresetNoneDataPluginParams>> = {
-  name: 'PRESET_MULTI_GRID_DIVERGING',
-  description: '雙向折線圖',
-  chartParams: {
-    padding: {
-      top: 60,
-      right: 60,
-      bottom: 120,
-      left: 60
-    },
-  },
-  dataFormatter: {
-    gridList: [
-      // 第一個grid
-      {
-        groupAxis: {
-          position: 'right'
-        },
-        valueAxis: {
-          position: 'bottom'
-        },
-      },
-      // 第二個grid
-      {
-        groupAxis: {
-          position: 'left'
-        },
-        valueAxis: {
-          position: 'bottom'
-        },
-      }
-    ],
-    // 設定排版方式
-    container: {
-      gap: 200,
-      rowAmount: 1,
-      columnAmount: 2
-    },
-    separateGrid: true // 將兩個grid拆分
-  },
-  allPluginParams: {
-    // ...ALL_PLUGIN_PARAMS_NONE_DATA,
-    MultiGroupAxis: {
-      tickPadding: 60, // 加長間距
-      gridIndexes: [0] // 只顯示一個
-    },
-    MultiValueAxis: {
-      gridIndexes: [0, 1]
-    },
-    MultiStackedValueAxis: {
-      gridIndexes: [0, 1]
-    },
-    MultiBars: {
-      gridIndexes: [0, 1]
-    },
-    MultiStackedBar: {
-      gridIndexes: [0, 1]
-    },
-    MultiBarsTriangle: {
-      gridIndexes: [0, 1]
-    },
-    MultiLines: {
-      gridIndexes: [0, 1]
-    },
-    MultiLineAreas: {
-      gridIndexes: [0, 1]
-    },
-    MultiDots: {
-      gridIndexes: [0, 1]
-    },
-    MultiGridLegend: {
-      // position: 'bottom',
-      // justify: 'center',
-      placement: 'bottom',
-      padding: 14,
-    }
-  }
-}
+import type { PresetPartial } from '../../lib/core-types'
+import type { 
+  PresetMultiGridPluginParams,
+  PresetNoneDataPluginParams
+} from '../types'
+
+export const PRESET_MULTI_GRID_DIVERGING: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
+& Partial<PresetNoneDataPluginParams>> = {
+  name: 'PRESET_MULTI_GRID_DIVERGING',
+  description: 'Diverging Grid',
+  descriptionZh: '雙向Grid',
+  chartParams: {
+    colors: {
+      light: {
+        label: [
+          "#0088FF",
+          "#16B59B",
+          "#6F3BD5",
+          "#EE5F13",
+          "#F9B052",
+          "#D4785A",
+          "#42C724",
+          "#FF4B4B",
+          "#1F3172",
+          "#E23D93"
+        ],
+      },
+      dark: {
+        label: [
+          "#4BABFF",
+          "#7DD3C4",
+          "#8454D4",
+          "#FF6C6C",
+          "#FAC77D",
+          "#D58C75",
+          "#42C724",
+          "#FF8B8B",
+          "#5366AC",
+          "#FF8DC8"
+        ]
+      }
+    },
+    padding: {
+      top: 40,
+      right: 40,
+      bottom: 100,
+      left: 80
+    },
+  },
+  dataFormatter: {
+    gridList: [
+      // 第一個grid
+      {
+        groupAxis: {
+          position: 'right'
+        },
+        valueAxis: {
+          position: 'bottom'
+        },
+      },
+      // 第二個grid
+      {
+        groupAxis: {
+          position: 'left'
+        },
+        valueAxis: {
+          position: 'bottom'
+        },
+      }
+    ],
+    // 設定排版方式
+    container: {
+      gap: 160,
+      rowAmount: 1,
+      columnAmount: 2
+    },
+    separateGrid: true // 將兩個grid拆分
+  },
+  pluginParams: {
+    MultiGroupAxis: {
+      gridIndexes: [0] // 只顯示一個
+    },
+    MultiValueAxis: {
+      gridIndexes: [0, 1]
+    },
+    MultiStackedValueAxis: {
+      gridIndexes: [0, 1]
+    },
+    MultiBars: {
+      gridIndexes: [0, 1]
+    },
+    MultiStackedBars: {
+      gridIndexes: [0, 1]
+    },
+    MultiBarsTriangle: {
+      gridIndexes: [0, 1]
+    },
+    MultiLines: {
+      gridIndexes: [0, 1]
+    },
+    MultiLineAreas: {
+      gridIndexes: [0, 1]
+    },
+    MultiDots: {
+      gridIndexes: [0, 1]
+    },
+    MultiGridLegend: {
+      placement: 'bottom',
+      padding: 14,
+    }
+  }
+}

package/src/multiGrid/PRESET_MULTI_GRID_DIVERGING_SIMPLE.ts

@@ -0,0 +1,115 @@
+import type { PresetPartial } from '../../lib/core-types'
+import type { 
+  PresetMultiGridPluginParams,
+  PresetNoneDataPluginParams
+} from '../types'
+
+export const PRESET_MULTI_GRID_DIVERGING_SIMPLE: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
+& Partial<PresetNoneDataPluginParams>> = {
+  name: 'PRESET_MULTI_GRID_DIVERGING_SIMPLE',
+  description: 'Simple diverging Grid',
+  descriptionZh: '簡單雙向Grid',
+  chartParams: {
+    colors: {
+      light: {
+        label: [
+          "#0088FF",
+          "#16B59B",
+          "#6F3BD5",
+          "#EE5F13",
+          "#F9B052",
+          "#D4785A",
+          "#42C724",
+          "#FF4B4B",
+          "#1F3172",
+          "#E23D93"
+        ],
+      },
+      dark: {
+        label: [
+          "#4BABFF",
+          "#7DD3C4",
+          "#8454D4",
+          "#FF6C6C",
+          "#FAC77D",
+          "#D58C75",
+          "#42C724",
+          "#FF8B8B",
+          "#5366AC",
+          "#FF8DC8"
+        ]
+      }
+    },
+    padding: {
+      top: 40,
+      right: 40,
+      bottom: 60,
+      left: 40
+    },
+  },
+  dataFormatter: {
+    gridList: [
+      // 第一個grid
+      {
+        groupAxis: {
+          position: 'right'
+        },
+        valueAxis: {
+          position: 'bottom',
+          scaleRange: [0, 0.95]
+        },
+      },
+      // 第二個grid
+      {
+        groupAxis: {
+          position: 'left'
+        },
+        valueAxis: {
+          position: 'bottom',
+          scaleRange: [0, 0.95]
+        },
+      }
+    ],
+    // 設定排版方式
+    container: {
+      gap: 140,
+      rowAmount: 1,
+      columnAmount: 2
+    },
+    separateGrid: true // 將兩個grid拆分
+  },
+  pluginParams: {
+    MultiGroupAxis: {
+      tickPadding: 10,
+      gridIndexes: [0] // 只顯示一個
+    },
+    MultiValueAxis: {
+      gridIndexes: [0, 1]
+    },
+    MultiStackedValueAxis: {
+      gridIndexes: [0, 1]
+    },
+    MultiBars: {
+      gridIndexes: [0, 1]
+    },
+    MultiStackedBars: {
+      gridIndexes: [0, 1]
+    },
+    MultiBarsTriangle: {
+      gridIndexes: [0, 1]
+    },
+    MultiLines: {
+      gridIndexes: [0, 1]
+    },
+    MultiLineAreas: {
+      gridIndexes: [0, 1]
+    },
+    MultiDots: {
+      gridIndexes: [0, 1]
+    },
+    MultiGridLegend: {
+      placement: 'bottom',
+      padding: 7,
+    }
+  }
+}

package/src/multiGrid/PRESET_MULTI_GRID_ROUND_STYLE.ts

@@ -1,58 +1,85 @@
-import type { PresetPartial } from '../../lib/core-types'
-import type {
-  PresetMultiGridPluginParams,
-  PresetNoneDataPluginParams
-} from '../types'
-// import { ALL_PLUGIN_PARAMS_NONE_DATA } from '../params'
-
-type PresetMultiGridRoundPluginParams = Omit<PresetMultiGridPluginParams, 'MultiBarsTriangle'>
-
-export const PRESET_MULTI_GRID_ROUND_STYLE: PresetPartial<'multiGrid', Partial<PresetMultiGridPluginParams>
-& Partial<PresetNoneDataPluginParams>> = {
-  name: 'PRESET_MULTI_GRID_ROUND_STYLE',
-  description: 'MultiGrid圓弧風格',
-  chartParams: {
-    padding: {
-      top: 60,
-      right: 60,
-      bottom: 120,
-      left: 60
-    },
-    highlightTarget: 'series'
-  },
-  allPluginParams: {
-    // ...ALL_PLUGIN_PARAMS_NONE_DATA,
-    MultiBars: {
-      barWidth: 0,
-      barPadding: 1,
-      barGroupPadding: 10,
-      barRadius: true,
-    },
-    MultiStackedBar: {},
-    MultiDots: {},
-    MultiGridLegend: {
-      // position: 'bottom',
-      // justify: 'center',
-      placement: 'bottom',
-      padding: 14,
-      gridList: [
-        {
-          listRectRadius: 7,
-        },
-        {
-          listRectHeight: 2,
-        }
-      ]
-    },
-    MultiGroupAxis: {},
-    MultiLineAreas: {},
-    MultiLines: {
-      lineCurve: 'curveMonotoneX',
-      lineWidth: 3
-    },
-    MultiValueAxis: {},
-    MultiStackedValueAxis: {},
-    OverlappingValueAxes: {},
-    OverlappingStackedValueAxes: {},
-  }
-}
+import type { PresetPartial } from '../../lib/core-types'
+import type {
+  PresetMultiGridPluginParams,
+  PresetNoneDataPluginParams
+} from '../types'
+
+type PresetMultiGridRoundPluginParams = Omit<PresetMultiGridPluginParams, 'MultiBarsTriangle'>
+
+export const PRESET_MULTI_GRID_ROUND_STYLE: PresetPartial<'multiGrid', Partial<PresetMultiGridRoundPluginParams>
+& Partial<PresetNoneDataPluginParams>> = {
+  name: 'PRESET_MULTI_GRID_ROUND_STYLE',
+  description: 'MultiGrid with round style',
+  descriptionZh: 'MultiGrid圓弧風格',
+  chartParams: {
+    colors: {
+      light: {
+        label: [
+          "#0088FF",
+          "#16B59B",
+          "#6F3BD5",
+          "#EE5F13",
+          "#F9B052",
+          "#D4785A",
+          "#42C724",
+          "#FF4B4B",
+          "#1F3172",
+          "#E23D93"
+        ],
+      },
+      dark: {
+        label: [
+          "#4BABFF",
+          "#7DD3C4",
+          "#8454D4",
+          "#FF6C6C",
+          "#FAC77D",
+          "#D58C75",
+          "#42C724",
+          "#FF8B8B",
+          "#5366AC",
+          "#FF8DC8"
+        ]
+      }
+    },
+    padding: {
+      top: 40,
+      right: 40,
+      bottom: 100,
+      left: 80
+    },
+    highlightTarget: 'series'
+  },
+  pluginParams: {
+    MultiBars: {
+      barWidth: 0,
+      barPadding: 1,
+      barGroupPadding: 10,
+      barRadius: true,
+    },
+    MultiStackedBars: {},
+    MultiDots: {},
+    MultiGridLegend: {
+      placement: 'bottom',
+      padding: 14,
+      gridList: [
+        {
+          listRectRadius: 7,
+        },
+        {
+          listRectHeight: 2,
+        }
+      ]
+    },
+    MultiGroupAxis: {},
+    MultiLineAreas: {},
+    MultiLines: {
+      lineCurve: 'curveMonotoneX',
+      lineWidth: 3
+    },
+    MultiValueAxis: {},
+    MultiStackedValueAxis: {},
+    OverlappingValueAxes: {},
+    OverlappingStackedValueAxes: {},
+  }
+}