fix:优化echart桑基图

data-room-ui/packages/BasicComponents/Sankey/index.vue

@@ -199,6 +199,10 @@ export default {
         series: [
           {
             type: 'sankey',
+            top: config.customize.top || 20,
+            bottom: config.customize.bottom || 20,
+            left: config.customize.left || 20,
+            right: config.customize.right || 50,
             label: {
               show: true,
               position: config.customize.normal.labelPosition || 'right',

data-room-ui/packages/BasicComponents/Sankey/setting.vue

@@ -290,6 +290,35 @@
           </el-select>
         </el-form-item>
       </div>
+      <SettingTitle>
+        边距
+      </SettingTitle>
+      <div class="lc-field-body">
+        <el-form-item label="上边距">
+          <el-input-number
+            v-model="config.customize.top"
+            class="bs-el-input-number"
+          />
+        </el-form-item>
+        <el-form-item label="下边距">
+          <el-input-number
+            v-model="config.customize.bottom"
+            class="bs-el-input-number"
+          />
+        </el-form-item>
+        <el-form-item label="左边距">
+          <el-input-number
+            v-model="config.customize.left"
+            class="bs-el-input-number"
+          />
+        </el-form-item>
+        <el-form-item label="右边距">
+          <el-input-number
+            v-model="config.customize.right"
+            class="bs-el-input-number"
+          />
+        </el-form-item>
+      </div>
     </el-form>
   </div>
 </template>

data-room-ui/packages/BasicComponents/Sankey/settingConfig.js

@@ -51,6 +51,10 @@ const customConfig = {
   },
   customize: {
     // 自定义样式
+    top: 20,
+    bottom: 20,
+    left: 20,
+    right: 50,
     normal: {
       labelPosition: 'right',
       labelColor: '#fff',
@@ -83,7 +87,7 @@ export const dataConfig = {
 export const sankeyData = {
   name: '桑基图',
   title: '桑基图',
-  icon: Icon.getNameList()[18],
+  icon: Icon.getNameList()[35],
   border: { type: '', titleHeight: 60, fontSize: 16, isTitle: true, padding: [0, 0, 0, 0] },
   className:
     'com.gccloud.dataroom.core.module.chart.components.ScreenCandlestickChart',

data-room-ui/packages/G2Plots/plotListSort.js

@@ -30,7 +30,6 @@ export default [
 
   '基础玉珏图',
 
-  '基础桑基图',
   '基础瀑布图',
 
   '水波图',

data-room-ui/packages/G2Plots/桑基图/基础桑基图.js

@@ -1,141 +0,0 @@
-/*
- * @description: 桑基图
- * @Date: 2024-0625
- * @Author: liu.shiyi
- */
-
-// 配置版本号
-const version = '2023111501'
-// 分类
-const category = 'Sankey'
-// 标题
-const title = '基础桑基图'
-// 类别， new Line()
-const chartType = 'Sankey'
-// 用于标识，唯一，和文件夹名称一致
-const name = 'JICHUSANGJITU'
-
-// 右侧配置项
-const setting = [
-  {
-    label: '起始节点',
-    type: 'select', // 设置组件类型
-    field: 'sourceField', // 字段
-    optionField: 'sourceField', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    value: '',
-    tabName: 'data'
-  },
-  {
-    label: '目标节点',
-    type: 'select', // 设置组件类型
-    field: 'targetField', // 字段
-    optionField: 'targetField', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    value: '',
-    tabName: 'data'
-  },
-  {
-    label: '权重',
-    type: 'select', // 设置组件类型
-    field: 'weightField', // 字段
-    optionField: 'weightField', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    value: '',
-    tabName: 'data'
-  },
-  /** 样式配置 **/
-  // 图表 graph
-  {
-    label: '背景颜色',
-    // 设置组件类型
-    type: 'colorSelect',
-    // 字段
-    field: 'color',
-    // 对应options中的字段
-    optionField: 'color',
-    value: ['#6b74e4', '#4391f4', '#38bbe5', '#69d6fd', '#36c6a0'],
-    tabName: 'custom',
-    groupName: 'graph'
-  },
-  {
-    label: '节点背景颜色',
-    type: 'colorPicker',
-    field: 'nodeStyle_fill',
-    optionField: 'nodeStyle.fill',
-    value: '#E5E6EB10',
-    tabName: 'custom',
-    groupName: 'graph'
-  },
-  {
-    label: '节点边框颜色',
-    type: 'colorPicker',
-    field: 'nodeStyle_stroke',
-    optionField: 'nodeStyle.stroke',
-    value: '#E5E6EB10',
-    tabName: 'custom',
-    groupName: 'graph'
-  }
-  // X轴 xAxis
-]
-
-// 模拟数据
-const data = [
-  { source: '首次打开', target: '首页 UV', value: 160 },
-  { source: '结果页', target: '首页 UV', value: 40 },
-  { source: '验证页', target: '首页 UV', value: 10 },
-  { source: '我的', target: '首页 UV', value: 10 },
-  { source: '朋友', target: '首页 UV', value: 8 },
-  { source: '其他来源', target: '首页 UV', value: 27 },
-  { source: '首页 UV', target: '理财', value: 30 },
-  { source: '首页 UV', target: '扫一扫', value: 40 },
-  { source: '首页 UV', target: '服务', value: 35 },
-  { source: '首页 UV', target: '蚂蚁森林', value: 25 },
-  { source: '首页 UV', target: '跳失', value: 10 },
-  { source: '首页 UV', target: '借呗', value: 30 },
-  { source: '首页 UV', target: '花呗', value: 40 },
-  { source: '首页 UV', target: '其他流向', value: 45 }
-]
-// 配置处理脚本
-const optionHandler = ''
-
-// 数据处理脚本
-const dataHandler = ''
-
-// 图表配置 new Line('domName', option)
-const option = {
-  // 数据将要放入到哪个字段中
-  dataKey: 'data',
-  // 图表内边距
-  appendPadding: [0, 0, 0, 0],
-  data,
-  sourceField: 'source',
-  targetField: 'target',
-  weightField: 'value',
-  nodeWidthRatio: 0.008,
-  nodePaddingRatio: 0.03,
-  color: ['#6b74e4', '#4391f4', '#38bbe5', '#69d6fd', '#36c6a0'],
-  nodeStyle: {
-    fill: '#72CC4A', // 设置节点颜色
-    stroke: '#72CC4A'
-  },
-  // edgeStyle: {
-  //   fill: '#E6E6E6', // 设置边颜色
-  //   stroke: '#E6E6E6',
-  //   fillOpacity: 0.6
-  // }
-}
-export default {
-  category,
-  version,
-  title,
-  chartType,
-  name,
-  option,
-  setting,
-  dataHandler,
-  optionHandler
-}