初始化

2025-11-08 10:38:36 +08:00
commit 3beeec7296
1626 changed files with 198488 additions and 0 deletions
--- a/frontend/packages/G2Plots/折线图/迷你基础折线图.js
+++ b/frontend/packages/G2Plots/折线图/迷你基础折线图.js
@@ -0,0 +1,117 @@
+/*
+ * @description: 配置，参考https://g2plot.antv.antgroup.com/examples
+ * @Date: 2023-03-27 14:38:23
+ * @Author: xing.heng
+ */
+
+// 配置版本号
+const version = '2023111401'
+// 分类
+const category = 'TinyLine'
+// 标题
+const title = '迷你基础折线图'
+// 类别， new Line()
+const chartType = 'TinyLine'
+// 用于标识，唯一，title的中文转拼音
+const name = 'MiNiJiChuZheXianTu'
+
+// 右侧配置项
+const setting = [
+  {
+    label: '维度',
+    // 设置组件类型， select / input / colorPicker
+    type: 'select',
+    // 字段
+    field: 'xField',
+    optionField: 'xField', // 对应options中的字段
+    // 是否多选
+    multiple: false,
+    // 绑定的值
+    value: '',
+    // tab页。 data: 数据， custom: 自定义
+    tabName: 'data'
+  },
+  {
+
+    label: '指标',
+    // 设置组件类型
+    type: 'select',
+    // 字段
+    field: 'yField',
+    // 对应options中的字段
+    optionField: 'yField',
+    // 是否多选
+    multiple: false,
+    value: '',
+    tabName: 'data'
+  },
+  /** 样式配置 **/
+  {
+    label: '平滑',
+    type: 'switch', // 设置组件类型
+    field: 'smooth', // 字段
+    optionField: 'smooth', // 对应options中的字段
+    value: true,
+    tabName: 'custom',
+    groupName: 'graph'
+  },
+  // 图表 graph
+  {
+    label: '折线宽度',
+    type: 'inputNumber', // 设置组件类型
+    field: 'lineStyle_lineWidth', // 字段
+    optionField: 'lineStyle.lineWidth', // 对应options中的字段
+    value: '2',
+    tabName: 'custom',
+    groupName: 'graph'
+  },
+  {
+    label: '折线颜色',
+    type: 'gradual', // 设置组件类型
+    field: 'lineStyle_stroke', // 字段
+    optionField: 'lineStyle.stroke', // 对应options中的字段
+    value: 'l(0) 0:#6B74E4 1:#6B74E4',
+    tabName: 'custom',
+    groupName: 'graph'
+  },
+  // 内边距 appendPadding
+  {
+    label: '',
+    type: 'appendPadding',
+    field: 'appendPadding',
+    optionField: 'appendPadding',
+    value: [0, 0, 0, 0],
+    tabName: 'custom',
+    groupName: 'appendPadding'
+  }
+]
+
+// 数据处理脚本,取出所有指标的值
+const dataHandler = '// 取出所有指标的值 \ndata = data.map(item => item[setting.filter(i => i.field === "yField")[0].value])'
+
+// 图表配置 new Line('domName', option)
+const option = {
+  // 图表内边距
+  appendPadding: [0, 0, 0, 0],
+  xField:'',
+  yField:'',
+  data: [100, 200, 300, 200, 100, 200, 300, 400],
+  height: 150,
+  autoFit: true,
+  smooth: true,
+  lineStyle: {
+    stroke: 'l(0) 0:#6B74E4 1:#6B74E4',
+    lineWidth: 2
+  }
+}
+
+export default {
+  category,
+  version,
+  title,
+  chartType,
+  name,
+  option,
+  setting,
+  dataHandler
+}