@ebiz/designer-components 0.0.48 → 0.0.49

package/src/components/charts/components/GaugeChart/handleSeries.js

@@ -1,504 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import { codeToHex, codeToRGB } from '../../util/color';
-import cloneDeep from '../../util/cloneDeep';
-import chartToken from './chartToken';
-import Token from '../../feature/token';
-import merge from '../../util/merge';
-
-export const emptySeriesUnit = {
-  type: 'gauge',
-  startAngle: 0,
-  endAngle: 0,
-  center: ['50%', '50%'],
-  radius: '50%',
-  splitNumber: 2,
-  axisLine: { show: false },
-  axisLabel: { show: false },
-  splitLine: { show: false },
-  itemStyle: { show: false },
-  axisTick: { show: false },
-  pointer: { show: false },
-  detail: { show: false },
-  title: { show: false },
-  data: [],
-};
-
-export const seriesInit = {
-  name: '',
-  type: 'gauge',
-  // 仪表盘轨道底色
-  axisLine: {
-    roundCap: true,
-    lineStyle: {
-      width: 10,
-    },
-  },
-  // 仪表盘进度条
-  progress: {
-    show: true,
-    roundCap: true,
-    width: 10,
-  },
-  // 大刻度数量
-  splitNumber: 4,
-  // 大刻度线样式
-  splitLine: {
-    distance: 0,
-    length: 10,
-    lineStyle: {
-      width: 2,
-    },
-  },
-  // 大刻度数值
-  axisLabel: {
-    distance: 16,
-    fontSize: 14,
-    color: 'red',
-  },
-  // 小刻度线样式
-  axisTick: {
-    distance: 0,
-    length: 10,
-    lineStyle: {
-      color: 'transparent',
-      width: 2,
-    },
-  },
-  // 指针样式
-  pointer: {
-    show: false,
-    icon: 'path://M4.49 10.21L0.1 1.44C-0.23 0.78 0.25 0 1 0L9.76 0C10.5 0 10.99 0.78 10.65 1.44C9.14 4.47 7.33 8.09 6.28 10.21C5.91 10.94 4.86 10.94 4.49 10.21Z',
-    length: '5%',
-    width: 16,
-    offsetCenter: [0, '-105%'],
-  },
-  title: {
-    show: false,
-  },
-  detail: {
-    valueAnimation: true,
-  },
-  data: [],
-};
-
-// 设置刻度线现实与否/刻度线数量
-function handleSplitLine(iChartOption, seriesUnit) {
-  if (iChartOption.splitLine) {
-    if (iChartOption.splitLine.show !== undefined) {
-      seriesUnit.splitLine.show = iChartOption.splitLine.show;
-    } else {
-      seriesUnit.splitLine.show = true;
-    }
-  } else {
-    seriesUnit.splitLine.show = true;
-  }
-  if (seriesUnit.splitLine.show) {
-    seriesUnit.splitNumber = iChartOption.splitNumber || 4;
-  } else {
-    seriesUnit.splitNumber = -1;
-  }
-  if (iChartOption.itemStyle) {
-    let { lineStyle, width } = iChartOption.itemStyle;
-    width = width || chartToken.barWidth;
-    seriesUnit.splitLine.length = (lineStyle && lineStyle.length) || width || 10;
-    seriesUnit.splitLine.distance = width ? width * -1 : -3;
-  } else {
-    seriesUnit.splitLine.length = 7;
-    seriesUnit.splitLine.distance = 0;
-  }
-  if (iChartOption.itemStyle && iChartOption.itemStyle.lineStyle) {
-    if (iChartOption.itemStyle.lineStyle.color) {
-      seriesUnit.splitLine.lineStyle.color = iChartOption.itemStyle.lineStyle.color;
-    } else {
-      seriesUnit.splitLine.lineStyle.color = chartToken.splitLineColor;
-    }
-    seriesUnit.splitLine.lineStyle.width = iChartOption.itemStyle.lineStyle.width || 4;
-  }
-}
-
-// 根据主题设置刻度线的颜色
-function handleTheme(iChartOption) {
-  const { orbitalColor } = iChartOption;
-  seriesInit.axisLine.lineStyle.color = [[1, orbitalColor || chartToken.axisLineColor]];
-  seriesInit.splitLine.lineStyle.color = chartToken.splitLineColor;
-  seriesInit.axisLabel.color = chartToken.axisLabel;
-}
-
-// 配置仪表盘中心文本
-function handleDetail(seriesUnit, text, data) {
-  seriesUnit.detail.formatter =
-    text.formatter ||
-    function (value) {
-      return `{value|${value}}\n{name|${data[0].name}}`;
-    };
-  seriesUnit.detail.offsetCenter = text.offset || [0, 0];
-  seriesUnit.detail.rich = {
-    value: {
-      fontSize: 60,
-      fontWeight: 'bolder',
-      color: chartToken.detailRichColor,
-    },
-    name: {
-      fontSize: 20,
-      color: chartToken.descRichColor,
-      padding: [24, 0, 0, 0],
-    },
-  };
-  if (text?.formatterStyle) {
-    merge(seriesUnit.detail.rich, text.formatterStyle)
-  }
-}
-
-// 设置仪表盘进度条宽度
-function handleProgress(seriesUnit, iChartOption, data) {
-  const { itemStyle } = iChartOption;
-  const barWidth = chartToken.barWidth;
-  seriesUnit.progress.width = itemStyle?.width ? itemStyle.width : barWidth;
-  if (data && data.length !== 0 && data[0].value === 0) {
-    seriesUnit.progress.roundCap = false;
-  }
-}
-
-// 设置仪表盘进度条宽度
-function handleAxisLine(seriesUnit, iChartOption) {
-  const { itemStyle } = iChartOption;
-  const barWidth = chartToken.barWidth;
-  seriesUnit.axisLine.lineStyle.width = itemStyle?.width ? itemStyle.width : barWidth;
-}
-
-// 轨道颜色分块
-function setSplitColor(series, splitColor, pointerStyle) {
-  series.axisLine.lineStyle.color = splitColor;
-  series.axisLine.roundCap = false;
-  series.progress.show = false;
-  series.pointer.itemStyle = pointerStyle?.color ? { color: pointerStyle.color } : { color: 'auto' };
-}
-
-// 给series配置progress渐变色，并考虑纯色情况
-function setGradientColor(series, gradientColor, pointerStyle) {
-  const value = series.data[0] ? series.data[0].value : 0;
-  const linearColor = {
-    type: 'linear',
-    x: 0,
-    y: 0,
-    x2: 1 / (value / series.max),
-    y2: 0,
-    colorStops: gradientColor.map((item, index) => {
-      return {
-        offset: index === 0 ? 0 : index / (gradientColor.length - 1),
-        color: item,
-      };
-    }),
-    global: false,
-  };
-  // 考虑纯色情况
-  if (linearColor.colorStops.length === 1) {
-    linearColor.colorStops.push({
-      offset: 1,
-      color: gradientColor[0],
-    });
-  }
-  series.progress.itemStyle = { color: linearColor };
-  series.pointer.itemStyle = pointerStyle?.color ? { color: pointerStyle.color } : { color: linearColor };
-}
-
-// 轨道颜色分块外环光晕效果
-function setOuterHalo(seriesHalo, splitColor) {
-  const temp = cloneDeep(emptySeriesUnit);
-  const outerGaugeHalo = cloneDeep(temp);
-  outerGaugeHalo.startAngle = seriesHalo.startAngle;
-  outerGaugeHalo.endAngle = seriesHalo.endAngle;
-  outerGaugeHalo.center = seriesHalo.center;
-  const distance = seriesHalo.pointer.lineDistance.slice(0, seriesHalo.pointer.lineDistance.length - 1) - 0;
-  outerGaugeHalo.radius = `${parseFloat(seriesHalo.radius) + distance}%`;
-  outerGaugeHalo.axisLine = {
-    lineStyle: {
-      width: 1,
-      opacity: 0.3,
-      color: splitColor,
-    },
-  };
-  outerGaugeHalo.splitNumber = splitColor.length;
-  outerGaugeHalo.splitLine = {
-    // 不同颜色之间的中缝
-    distance: 8,
-    length: 10,
-    lineStyle: {
-      width: 2,
-      color: '',
-    },
-  };
-  // 2022/7/18 暂时把分割颜色屏蔽掉 darkColor、lightColor
-  outerGaugeHalo.splitLine.lineStyle.color = 'transparent';
-
-  return outerGaugeHalo;
-}
-
-// progress渐变色外环光晕效果
-function setProgressOuterHalo(series, outerGradientColor, mask, iChartOption) {
-  const temp = cloneDeep(emptySeriesUnit);
-  const linearColor = {
-    type: 'linear',
-    x: 0,
-    y: 0,
-    x2: 1,
-    y2: 0,
-    colorStops: outerGradientColor.map((item, index) => {
-      return {
-        offset: index === 0 ? 0 : index / (outerGradientColor.length - 1),
-        color: item,
-      };
-    }),
-    global: false,
-  };
-  const outerGauge = cloneDeep(temp);
-  outerGauge.startAngle = series.startAngle;
-  outerGauge.endAngle = series.endAngle;
-  // 是否开启蒙层及角度
-  if (mask && mask.show) {
-    outerGauge.startAngle = series.startAngle - 5;
-    outerGauge.endAngle = series.endAngle + 5;
-  }
-  outerGauge.center = series.center;
-  const distance = series.pointer.lineDistance.slice(0, series.pointer.lineDistance.length - 1) - 0;
-  outerGauge.radius = `${parseFloat(series.radius) + distance}%`;
-  outerGauge.axisLine = {
-    lineStyle: {
-      width: 1,
-      opacity: 0.3,
-      color: [[1, linearColor]],
-    },
-  };
-  // 开启蒙层outerGauge原先的光晕线变为蒙层区域，配置样式
-  if (mask && mask.show) {
-    const { pointerStyle } = iChartOption;
-    outerGauge.axisLine = {
-      lineStyle: {
-        width: mask.width || ((pointerStyle && pointerStyle.lineDistance) || '5%').replace('%', '') * 2.5,
-        opacity: 0.1,
-        color: [[1, linearColor]],
-      },
-    };
-  }
-  return outerGauge;
-}
-
-// 蒙层开启后，配置高亮光晕线
-function setHightLightGauge(series, iChartOption) {
-  const { gradientColor, mask } = iChartOption;
-  // 是否开启蒙层
-  if (mask && mask.show) {
-    const { pointerStyle } = iChartOption;
-    const outerGauge = cloneDeep(emptySeriesUnit);
-    outerGauge.startAngle = series.startAngle - 5;
-    outerGauge.endAngle = series.endAngle + 5;
-    outerGauge.center = series.center;
-    const seriesRadius = series.radius.replace('%', '');
-    const pointerRadius = (pointerStyle && pointerStyle.lineDistance) || '5%';
-    outerGauge.radius = `${seriesRadius - 0 + (pointerRadius.replace('%', '') - 0)}%`;
-    if (mask.hightLight !== false) {
-      mask.hightLight = true;
-    }
-    // 是否开启蒙层高亮
-    if (mask && mask.hightLight) {
-      const linearColor = {
-        type: 'linear',
-        x: 0,
-        y: 0,
-        x2: 1,
-        y2: 0,
-        colorStops: gradientColor.map((item, index) => {
-          return {
-            offset: index === 0 ? 0 : index / (gradientColor.length - 1),
-            color: codeToRGB(codeToHex(item), 0.5),
-          };
-        }),
-        global: false,
-      };
-      const max = iChartOption.max || 100;
-      outerGauge.axisLine = {
-        lineStyle: {
-          width: 1,
-          opacity: 1,
-          color: [
-            // [0.28, linearColor],
-            [(iChartOption.data[0].value - (5 * max) / 100) / max, codeToRGB(codeToHex(gradientColor[0]), 0.5)],
-            [(iChartOption.data[0].value + (5 * max) / 100) / max, codeToRGB(codeToHex(gradientColor[0]), 1)],
-            [1, linearColor],
-          ],
-        },
-      };
-    } else {
-      const linearColor = {
-        type: 'linear',
-        x: 0,
-        y: 0,
-        x2: 1,
-        y2: 0,
-        colorStops: gradientColor.map((item, index) => {
-          return {
-            offset: index === 0 ? 0 : index / (gradientColor.length - 1),
-            color: item,
-          };
-        }),
-        global: false,
-      };
-      outerGauge.axisLine = {
-        lineStyle: {
-          width: 1,
-          opacity: 0.3,
-          color: [[1, linearColor]],
-        },
-      };
-    }
-    return outerGauge;
-  }
-}
-
-// 添加一个空series，使用该空series的pointer来作为阈值线的红线
-function setMarkLine(series, markLine, marklineColor) {
-  const temp = cloneDeep(emptySeriesUnit);
-  const markGauge = cloneDeep(temp);
-  markGauge.name = 'markLine';
-  markGauge.min = series.min;
-  markGauge.max = series.max;
-  markGauge.startAngle = series.startAngle;
-  markGauge.endAngle = series.endAngle;
-  markGauge.center = series.center;
-  markGauge.radius = series.radius;
-  markGauge.animation = false;
-  markGauge.pointer = {
-    icon: 'path://M0 0 L30 0 L30 100 L0 100 Z',
-    width: 3,
-    length: 15,
-    offsetCenter: [0, '-86%'],
-    itemStyle: {
-      color: marklineColor,
-    },
-  };
-  markGauge.data = [{ value: markLine }];
-  return markGauge;
-}
-
-function handleOther(iChartOption, seriesUnit, series, data) {
-  const marklineColor = Token.config.colorState.colorError
-  if (iChartOption.splitColor && iChartOption.splitColor.length > 0) {
-    setSplitColor(seriesUnit, iChartOption.splitColor, iChartOption.pointerStyle);
-  } else if (iChartOption.gradientColor && iChartOption.gradientColor.length > 0) {
-    setGradientColor(seriesUnit, iChartOption.gradientColor, iChartOption.pointerStyle);
-  }
-  // 若有阈值线，超过阈值线时为红色
-  if (iChartOption.markLine && data[0].value >= iChartOption.markLine) {
-    seriesUnit.pointer.itemStyle = { color: marklineColor };
-    seriesUnit.progress.itemStyle = { color: marklineColor };
-  }
-  series.push(seriesUnit);
-  // 轨道颜色分块、progress外环光晕效果
-  if (iChartOption.splitColor && iChartOption.splitColor.length > 0) {
-    const outerGauge = setOuterHalo(seriesUnit, iChartOption.splitColor);
-    // 是否展示外层光晕
-    if (iChartOption.itemStyle && iChartOption.itemStyle.outerGauge) {
-      if (iChartOption.itemStyle.outerGauge.show === false) {
-        outerGauge.axisLine.lineStyle.width = 0;
-        outerGauge.axisLine.lineStyle.opacity = 0;
-      }
-    }
-    series.push(outerGauge);
-  } else if (iChartOption.gradientColor && iChartOption.gradientColor.length > 1) {
-    const outerGauge = setProgressOuterHalo(seriesUnit, iChartOption.gradientColor, iChartOption.mask, iChartOption);
-    // 是否展示外层光晕
-    if (iChartOption.itemStyle && iChartOption.itemStyle.outerGauge) {
-      if (!iChartOption.itemStyle.outerGauge.show) {
-        outerGauge.axisLine.lineStyle.width = 0;
-        outerGauge.axisLine.lineStyle.opacity = 0;
-      }
-    }
-    series.push(outerGauge);
-    // 蒙层及高亮
-    const hightLightGauge = setHightLightGauge(seriesUnit, iChartOption);
-    series.push(hightLightGauge);
-  }
-  // 阈值线
-  if (iChartOption.markLine) {
-    const markGauge = setMarkLine(seriesUnit, iChartOption.markLine, marklineColor);
-    series.push(markGauge);
-  }
-}
-
-function setSeriesInit(seriesUnit, iChartOption) {
-  const chartPosition = iChartOption.position || iChartOption.chartPosition || {};
-  const { pointerStyle, pointer, min, max, startAngle, endAngle } = iChartOption;
-  seriesUnit.name = iChartOption.seriesName || iChartOption.name;
-  seriesUnit.data = iChartOption.data.length ? iChartOption.data : [{value:0,name: ''}];
-  // 指针
-  seriesUnit.pointer.show = pointer || false;
-  seriesUnit.pointer.width = (pointerStyle && pointerStyle.width) || 16;
-  seriesUnit.pointer.length = (pointerStyle && pointerStyle.length) || '5%';
-  seriesUnit.pointer.offsetCenter[1] = (pointerStyle && pointerStyle.pointerDistance) || '-108%';
-  seriesUnit.pointer.lineDistance = (pointerStyle && pointerStyle.lineDistance) || '5%';
-  // 位置
-  seriesUnit.center = chartPosition.center || ['50%', '50%'];
-  // 半径
-  seriesUnit.radius = chartPosition.radius || '70%';
-  // 最小值
-  seriesUnit.min = min || 0;
-  // 最大值
-  seriesUnit.max = max || 100;
-  // 开始角度
-  seriesUnit.startAngle = startAngle === undefined ? 225 : startAngle;
-  // 结束角度
-  seriesUnit.endAngle = endAngle === undefined ? -45 : endAngle;
-}
-
-/**
- * 组装echarts所需要的series
- * @param {主题} theme
- * @param {数据} data
- * @returns
- */
-function handleSeries(iChartOption) {
-  const data = iChartOption.data.length ? iChartOption.data : [{value:0,name: ''}];
-  const text = iChartOption.text || {};
-  const axisLabelStyle = iChartOption.axisLabelStyle || {};
-  const { silent } = iChartOption;
-  // 更改仪表盘轨道底色
-  handleTheme(iChartOption);
-  // 更换刻度文本颜色、字号、字体宽度等样式
-  if (axisLabelStyle['color']) {
-    seriesInit.axisLabel['color'] = axisLabelStyle['color'];
-  } else {
-    seriesInit.axisLabel['color'] = chartToken.descRichColor;
-  }
-  seriesInit.axisLabel['distance'] = axisLabelStyle['distance'] || 22;
-  seriesInit.axisLabel['fontWeight'] = axisLabelStyle['fontWeight'] || 400;
-  seriesInit.axisLabel['fontSize'] = axisLabelStyle['fontSize'] || 14;
-  // 组装数据
-  const series = [];
-  const seriesUnit = cloneDeep(seriesInit);
-  setSeriesInit(seriesUnit, iChartOption);
-  // 控制刻度线及刻度文本是否展示;大刻度数量以及判断刻度文本是否显示
-  handleSplitLine(iChartOption, seriesUnit);
-  // 中间文本
-  handleDetail(seriesUnit, text, data);
-  // 进度条宽度
-  handleProgress(seriesUnit, iChartOption, data);
-  handleAxisLine(seriesUnit, iChartOption);
-
-  // 轨道颜色分块、progress渐变只能二选一
-  handleOther(iChartOption, seriesUnit, series, data);
-  // 是否关闭hover态的效果，默认为false
-  series[0].silent = silent || false;
-  return series;
-}
-
-export default handleSeries;

package/src/components/charts/components/GaugeChart/index.js

@@ -1,53 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import BaseOption from './BaseOption';
-import handleSeries from './handleSeries';
-import cloneDeep from '../../util/cloneDeep';
-import { handleTooltip } from './handleOptipn';
-import { mergeSeries } from '../../util/merge';
-import init from '../../option/init'
-import { CHART_TYPE } from '../../util/constants';
-
-class GaugeChart {
-
-  static name = CHART_TYPE.GAUGE
-
-  constructor(iChartOption, chartInstance) {
-    this.baseOption = {};
-    this.iChartOption = {};
-    this.baseOption = cloneDeep(BaseOption);
-    // 组装 iChartOption, 补全默认值
-    this.iChartOption = init(iChartOption);
-    // 根据 iChartOption 组装 baseOption
-    this.updateOption(iChartOption, chartInstance);
-  }
-
-  updateOption(iChartOption, chartInstance) {
-    // 图表基础颜色
-    this.baseOption.color = iChartOption.color;
-    // 图表鼠标悬浮提示框
-    this.baseOption.tooltip = handleTooltip(iChartOption, CHART_TYPE.GAUGE);
-    // 赋值数据
-    this.baseOption.series = handleSeries(iChartOption, this.baseOption.color);
-    // 合并用户自定义series
-    this.baseOption.legend.show = false;
-    mergeSeries(iChartOption, this.baseOption);
-  }
-
-  getOption() {
-    return this.baseOption;
-  }
-
-  setOption() { }
-}
-
-export default GaugeChart;

package/src/components/charts/components/GraphChart/index.js

@@ -1,34 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-import merge from '../../util/merge';
-
-class GraphChart {
-  constructor(iChartOption) {
-    this.rootData = {};
-    this.baseOption = {};
-    // 根据 iChartOption 组装 baseOption
-    this.updateOption(iChartOption);
-  }
-
-  updateOption(iChartOption) {
-    // 兼容echarts属性
-    merge(this.baseOption, iChartOption);
-  }
-
-  getOption() {
-    return this.baseOption;
-  }
-
-  setOption() { }
-}
-
-export default GraphChart;

package/src/components/charts/components/GraphTreeChart/BaseOption.js

@@ -1,42 +0,0 @@
-/**
- * Copyright (c) 2024 - present OpenTiny HUICharts Authors.
- * Copyright (c) 2024 - present Huawei Cloud Computing Technologies Co., Ltd.
- *
- * Use of this source code is governed by an MIT-style license.
- *
- * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
- * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
- * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
- *
- */
-const BaseOption = {
-  series: [
-    {
-      type: 'graph',
-      layout: 'force',
-      // 可拖动
-      draggable: false,
-      lineStyle: {},
-      // symbol保持纵横比例
-      symbolKeepAspect: true,
-      edgeSymbolSize: 6,
-    },
-  ],
-};
-
-// 虚拟节点图标---(小黄块symbolSize=20)
-const virtualNodeSymbol =
-  'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAGRJREFUSEtjZBggwDhA9jKMWky3kB8N6tGgplkIEJ247u+y/0+MKxTdDhJlJlGKQBaOWowr2EeDGlfIjCYunFl15GUnYkotUtQQnbhIMZQYtaMWExNKVFEzGtRUCUZiDBl5QQ0AkpooH6Q8aKIAAAAASUVORK5CYII=';
-
-// 亮色箭头 #939393
-const lightArrow =
-  'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAoCAYAAADDo7u9AAAAAXNSR0IArs4c6QAAAWhJREFUOE+F0k1uwkAMBeBxsotUrlGOUY5RtlmSjCKVYxQpys8yWzhGOQZcA6TsEld+ikdWmahsUJgnP/NlyJnPMAxv8pjn+VN/Jhuo6/pdnququkcDbdt+yEFZltdooO/7Tzk4HA6XaKBpmi858N6fooGu677loCiK49qE8zJhv7bkz7Lkbq3itlRs1yoeS8XmJSCK4zgikGXZRjWDpCimaYqKaZq2qhkCiyKWdM7tVDMERHGeZ/zNJEn2qhkCokhEgGLmo2qGgCgyM6iJ6KSadsKZiPCymPnivYemXVIWxOt2zl3LsoSmrbgxMy4MEd2LooCmrXgQEa4cMz+999BEwCoqsWoiYBU1oJoI/FHUDDQRsIp6qpoIWEUNqCYCVjHcg0VTJwRFMwGauqRV1Aw0tSIomgpoakVQNBXQpJii1aSYotWkFcWgSTFFq0kxRatJMUWrKRNeFK2mLBlTDJoSYH2Kff8b+AXnbeyqFFaSkgAAAABJRU5ErkJggg==';
-
-// 暗色箭头 #dddddd
-const darkArrow =
-  'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAoCAYAAADDo7u9AAAAAXNSR0IArs4c6QAAAVtJREFUOE+F0s1tg0AQhmE+7uFGAcBKcRlxGXYbdhlxG3YZdhmxxE8BvuE7E82nndUoLAoXBPtqx34WFO56vV4f+ljX9dtewwfjOH7qc9u2z2wwTdOXLjRN89gKDjG4bY04xRGXbND3/bcuhBDOW8E1Bset4B6DfTYYhuFHF7qu223tMMcdqlWgivM8M6iqqjLNJKmKIsIRAHammQJVXJaFP7Isy71p+uCwLAv/ZlmWx6ZpqOlHnESEUADObdtSMwWqCIDUInIxTR9cAfCwROQWQqCmD+4AeNwi8gghUDMFUZEfTFEUT9P0O8wA+MmJyDuEQE0GXtGITZOBV0xnEDUZeEULTNOCpOgCatqIpOhGUJOBV7TANC1Iii6gpgVJ0QXUZPBH0Rpq2g5J0e1ATeQUvSZyil4TOUWvqcFK0WvqiJWi10RO0WtqsFL0mhqsFL0mhmEQe5G7/xv8AiXLAYACDjIWAAAAAElFTkSuQmCC';
-
-const lightColor = '#939393';
-const darkColor = '#dddddd';
-
-export { BaseOption, lightArrow, darkArrow, virtualNodeSymbol, lightColor, darkColor };