@ebiz/designer-components 0.0.48 → 0.0.49

package/src/components/charts/components/FlowChart/LineManager.js

@@ -1,278 +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 LineRound from './LineRound';
-import LineBezier from './LineBezier';
-import LineDirect from './LineDirect';
-import { createTransLine, transLine } from './LineMode';
-import { NODE_ID_PREFIX } from './NodeManager';
-import { attr, addClass, createSvgByTag } from './util';
-
-const LINE_ID_PREFIX = 'fc-line-';
-const TYPE_ROUND = 'Round';
-const TYPE_BEZIER = 'Bezier';
-const TYPE_Direct = 'Direct';
-const TYPE_STRAIGHT = 'Straight';
-
-const defaultStyle = {
-    width: 1,
-    color: '#c2c2c2',
-    type: TYPE_ROUND,
-};
-
-const LineFactory = {
-    [TYPE_ROUND]: LineRound,
-    [TYPE_Direct]: LineDirect,
-    [TYPE_BEZIER]: LineBezier,
-    [TYPE_STRAIGHT]: LineRound
-}
-
-// 流程线仅支持直线和折线图
-const transLineType = ['Direct', 'Round', 'Straight'];
-export default class LineManager {
-    // 连线样式
-    style;
-    // 连线数据计算器
-    lineCreator;
-    // 连线方向
-    direction;
-
-    constructor(data, container, tagContainer, containerPosn, option) {
-        this.data = data;
-        this.option = option;
-        this.tagContainer = tagContainer;
-        this.direction = option.direction;
-        this.initColor(option);
-        this.style = Object.assign({},defaultStyle, option.lineStyle);
-        this.createLineCreator(container);
-        this.initArrow();
-        this.container = container;
-        this.containerPosn = containerPosn;
-        this.getLineAlignStyle(data.edges);
-        this.createLines(data.edges);
-        this.connectVirtualLine(data.edges);
-        this.createTags(data.edges);
-    }
-
-    initColor(option) {
-        if (option.theme && option.theme === 'dark') {
-            defaultStyle.color = '#ffffff';
-        }
-    }
-
-    initArrow() {
-        let arrow = document.getElementById('markerArrow');
-        let color = this.style.color || '#c2c2c2';
-        attr(arrow, 'fill', color);
-    }
-
-    /**
-     * 生成连线数据计算器
-     */
-    createLineCreator(container) {
-        if(this.style.type === TYPE_STRAIGHT){
-            this.style.radius = 0;
-        }
-        const CreatorClass = LineFactory[this.style.type];
-        this.lineCreator = new CreatorClass(this.style, {
-            gContainer: container,
-            tagContainer: this.tagContainer
-        });
-    }
-
-    /**
-     *
-     * 计算连线的对齐方式，是向前对齐，还是向后对齐
-     */
-    getLineAlignStyle(edges){
-        edges.forEach(edge => {
-            if(!edge.alignType){
-                let sameSource = edges.filter(item =>{
-                    return (item.source === edge.source) && (item !== edge)
-                });
-                if(sameSource.length > 0){
-                    edge.alignType = 'source';
-                    sameSource.forEach(item => {
-                        item.alignType = 'source';
-                    });
-                }
-            }
-        });
-        edges.forEach(edge => {
-            if(!edge.alignType){
-                edge.alignType = 'target';
-            }
-        });
-    }
-
-    /**
-     * 计算连线数据
-     */
-    setData(edge) {
-        if(edge?.lineStyle?.type){ // edge节点应用自身设置的连线样式
-            const CreatorClass = LineFactory[edge?.lineStyle?.type];
-            let lineCreator= new CreatorClass(edge?.lineStyle, {
-                gContainer: this.container,
-                tagContainer: this.tagContainer
-            })
-            return lineCreator.setData(edge, this.data, this.direction);
-        }else{
-            this.lineCreator.setData(edge, this.data, this.direction);
-        }
-        // 用户自定义edge位置修正
-        if (edge.offset) {
-            edge.offset(edge)
-        }
-    }
-
-    /**
-     * 拼接连线信息
-     */
-    setPath(edge) {
-        if(edge?.lineStyle?.type){ // edge节点应用自身设置的连线样式
-            const CreatorClass = LineFactory[edge?.lineStyle?.type];
-            let lineCreator= new CreatorClass(edge?.lineStyle, {
-                gContainer: this.container,
-                tagContainer: this.tagContainer
-            })
-            return lineCreator.setPath(edge)
-        }else{
-            return this.lineCreator.setPath(edge);
-        }
-    }
-
-    // 根据数据创建连线
-    createLines(edges) {
-        edges.forEach(edge => {
-            this.setData(edge);
-            let path = this.createLine(edge);
-            this.container.appendChild(path);
-        });
-    }
-
-    // 创建连线dom
-    createLine(edge) {
-        let path = createSvgByTag('path');
-        let id = LINE_ID_PREFIX + edge.source + '-to-' + edge.target;
-        let d = this.setPath(edge);
-        edge.id = id;
-        attr(path, 'd', d);
-        attr(path, 'id', id);
-        if (this.style.color) {
-            attr(path, 'stroke', this.style.color);
-        }
-        if (this.style.dash || this.style.mode === 'dash') {
-            attr(path, 'stroke-dasharray', 5);
-        }
-        if (edge.lineStyle && edge.lineStyle.color) {
-            attr(path, 'stroke', edge.lineStyle.color);
-        }
-        if (edge.lineStyle && ( edge.lineStyle.dash || edge.lineStyle.mode === 'dash')) {
-            attr(path, 'stroke-dasharray', 5);
-        }
-        if (edge.lineStyle && edge.lineStyle.dash === false) {
-            attr(path, 'stroke-dasharray', 0);
-        }
-        if (this.style.width) {
-            attr(path, 'stroke-width', this.style.width + 'px');
-        }
-        if (edge.lineStyle && edge.lineStyle.width) {
-            attr(path, 'stroke-width', edge.lineStyle.width + 'px');
-        }
-        addClass(path, 'fc-line');
-        // type为Direct  不添加箭头
-        const noDirect=edge?.lineStyle?.type===TYPE_Direct||this.style.type===TYPE_Direct
-        addClass(path,noDirect?'fc-noArrow':'')
-
-        if (this.isTransLine(edge)) {
-          path = createTransLine(d, transLine(edge, id, edge.lineStyle?.transPattern || this.style.transPattern))
-        }else{
-          let childNode = document.getElementById(edge.id)
-          childNode && document.getElementById('fc-trans-container').removeChild(childNode)
-        }
-        return path;
-    }
-
-    // 是否是流程线
-    isTransLine(edge){
-      let isTrans = false;
-      if(transLineType.includes(this.style.type)){
-        if(this.style.mode === 'trans'){
-          isTrans = true;
-          if('lineStyle' in edge && 'mode' in edge.lineStyle){
-            if(edge.lineStyle.mode !== 'trans'){
-              isTrans = false;
-            }
-          }
-        }else{
-          if('lineStyle' in edge && 'mode' in edge.lineStyle && edge.lineStyle.mode === 'trans'){
-            isTrans = true;
-          }
-        }
-      }
-      return isTrans;
-    }
-
-    // 将两段虚拟连线链接起来
-    connectVirtualLine(edges){
-        // 取出所有 target 为 virtual 的连线
-        let targetVirtualEdges = edges.filter((edge) => {
-          return edge.target.includes('virtual');
-        });
-        // 取出所有 source 为  virtual 的连线
-        let sourceVirtualEdges = edges.filter((edge) => {
-          return edge.source.includes('virtual');
-        });
-        targetVirtualEdges.forEach(targetEdge => {
-            let sourceEdge = sourceVirtualEdges.filter(item=> item.source === targetEdge.target)[0];
-            let targetEdgeDom = this.container.querySelector(`#${targetEdge.id}`);
-            let sourceEdgeDom = this.container.querySelector(`#${sourceEdge.id}`);
-            sourceEdgeDom.remove();
-            let newPath =  targetEdgeDom.getAttribute('d') + ' L' + sourceEdgeDom.getAttribute('d').slice(1);
-            let newId = LINE_ID_PREFIX + targetEdge.source + '-to-' + sourceEdge.target;
-            targetEdgeDom.setAttribute('d', newPath);
-            targetEdgeDom.setAttribute('id', newId);
-        });
-    }
-
-    createTags(edges){
-        edges.forEach(edge => {
-            this.option.renderTag && this.option.renderTag(this.tagContainer, edge);
-        });
-    }
-
-
-    // 更新连线
-    updateLine(domId) {
-        let nodeId = domId?.replace(NODE_ID_PREFIX, '');
-        this.data.edges.forEach(edge => {
-            if (edge.source === nodeId || edge.target === nodeId) {
-                this.setData(edge);
-                let id = LINE_ID_PREFIX + edge.source + '-to-' + edge.target;
-                if(this.isTransLine(edge)){
-                  let parentNode = document.getElementById('fc-trans-container')
-                  let updateChild = document.getElementById(id)
-                  updateChild && parentNode.removeChild(updateChild);
-                  createTransLine(this.setPath(edge), transLine(edge, id, edge.lineStyle?.transPattern || this.style.transPattern))
-                }
-                  document.getElementById(id)?.setAttribute('d', this.setPath(edge));
-            }
-        });
-    }
-
-    // 更新所有连线
-    updateAllLine () {
-        this.data.nodes.forEach((node)=>{
-            let domId = node.dom?.id || node.id;
-            this.updateLine(domId);
-        })
-    }
-}

package/src/components/charts/components/FlowChart/LineMode.js

@@ -1,44 +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 { attr } from './util';
-
-// 创建流程线
-function createTransLine(d, data) {
-  let transDiv = document.createElement('div');
-  let str = '';
-  for (let i = 0; i < data.length; i++) {
-    str += `<div class="fc-trans-point" style="offset-path:path('${d}');offset-distance:${Number(100 * i / data.length) + 1}%;"></div>`
-  }
-  transDiv.insertAdjacentHTML('beforeend', str);
-  let cloneNode = transDiv.cloneNode(true);
-  attr(cloneNode, 'id', data.id)
-  let childArr = cloneNode.childNodes;
-  for(let i of childArr){
-    data.transPattern && (i.style.background = `url(${data.transPattern})`);
-  }
-  document.getElementById('fc-trans-container').appendChild(cloneNode);
-  return transDiv;
-}
-
-// 计算trans线段长度
-function transLine(edge, id ,transPattern){
-  let XLineLength = Math.abs(edge.endPoint.x - edge.startPoint.x);
-  let YLineLength = Math.abs(edge.endPoint.y - edge.startPoint.y);
-  let data = {
-    id,
-    length: Math.ceil((XLineLength + YLineLength) / 6),
-    transPattern
-  }
-  return data;
-}
-
-export { createTransLine, transLine }

package/src/components/charts/components/FlowChart/LineRound.js

@@ -1,335 +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 VDirection = ['TB', 'BT', 'V'];
-const HDirection = ['LR', 'RL', 'H'];
-
-// 圆角曲线连线
-export default class LineRound {
-    // 默认圆弧拐角的 radius 为 20
-    radius = 10;
-    // 连线向前多少开始拐弯
-    dis = 15;
-    // 直角拐点占水平距离的百分比
-    lineDistance = 0.5;
-
-    constructor(option) {
-        this.radius = option.radius === undefined ? this.radius : option.radius;
-        this.lineDistance = option.lineDistance || 0.5;
-    }
-
-    /**
-     * 以lineRound作为试点，连线有两种对齐方式：
-     * 1. 默认为向后对齐，即向target节点对齐，优先级低
-     * 2. 然后再将source节点出来的连线向前对齐，优先级高
-     */
-    setData(edge, data, direction) {
-        if(VDirection.indexOf(direction) !== -1){
-            if(edge.alignType == 'target'){
-                this.setTargetDataV(edge, data);
-            }else if(edge.alignType == 'source'){
-                this.setSourceDataV(edge, data);
-            }
-        }else{
-            if(edge.alignType == 'target'){
-                this.setTargetData(edge, data);
-            }else if(edge.alignType == 'source'){
-                this.setSourceData(edge, data);
-            }
-        }
-    }
-
-    // 计算出以目标节点为对齐方式的连线数据
-    setTargetData(targetEdge, data){
-        let end = targetEdge.target;
-        let start = targetEdge.source;
-        let nodesObj = data.nodesObj;
-        let startWidth = nodesObj[start].width || 50;
-        let startInnerWidth = nodesObj[start].innerWidth || 50;
-        let startHeight = nodesObj[start].height || 50;
-        let endWidth = nodesObj[end].width || 50;
-        let endInnerWidth = nodesObj[end].innerWidth || 50;
-        let endHeight = nodesObj[end].height || 50;
-        // 拐角半径
-        targetEdge.radius = this.radius;
-        // 起始点
-        targetEdge.startPoint = {
-            x: nodesObj[start].x + startWidth + ( startInnerWidth - startWidth ) / 2-data.minX,
-            y: nodesObj[start].y + startHeight / 2-data.minY,
-        };
-        // 结束点
-        targetEdge.endPoint = {
-            x: nodesObj[end].x - ( endInnerWidth - endWidth ) / 2-data.minX,
-            y: nodesObj[end].y + endHeight / 2-data.minY,
-        };
-        let vDis = targetEdge.endPoint.y - targetEdge.startPoint.y;
-        // endPoint向左距离20点位置开始绘制曲线
-        let hDis = this.dis;
-
-        // radius 根据 vDis 大小而动态调整
-        if(Math.abs(vDis) <= this.radius * 2){
-            targetEdge.radius = Math.abs(vDis) / 2;
-        }
-
-        let revise = targetEdge.radius;
-        // 当end节点在start节点下方时，个别点的位置需要修正
-        if(targetEdge.endPoint.y < targetEdge.startPoint.y){
-            revise = -targetEdge.radius
-        }
-        // 第一个圆弧起始点
-        targetEdge.firstRoundStartPoint = {
-            x: targetEdge.endPoint.x  - hDis - targetEdge.radius * 2,
-            y: targetEdge.startPoint.y,
-        }
-        // 第一个圆弧控制点
-        targetEdge.firstRoundControlPoint = {
-            x: targetEdge.endPoint.x - hDis - targetEdge.radius,
-            y: targetEdge.startPoint.y,
-        }
-        // 第一个圆弧结束点
-        targetEdge.firstRoundEndPoint = {
-            x: targetEdge.endPoint.x - hDis - targetEdge.radius,
-            y: targetEdge.startPoint.y + revise,
-        };
-        // 第二个圆弧起始点
-        targetEdge.secondRoundStartPoint = {
-            x: targetEdge.endPoint.x - hDis - targetEdge.radius,
-            y: targetEdge.endPoint.y - revise,
-        };
-        // 第二个圆弧控制点
-        targetEdge.secondRoundControlPoint = {
-            x: targetEdge.endPoint.x - hDis - targetEdge.radius,
-            y: targetEdge.endPoint.y,
-        };
-        // 第二个圆弧结束点
-        targetEdge.secondRoundEndPoint = {
-            x: targetEdge.endPoint.x - hDis,
-            y: targetEdge.endPoint.y,
-        };
-    }
-
-    // 计算出以源头节点为对齐方式的连线数据
-    setSourceData(edge, data){
-        let end = edge.target;
-        let start = edge.source;
-        let nodesObj = data.nodesObj;
-        let startWidth = nodesObj[start].width || 50;
-        let startInnerWidth = nodesObj[start].innerWidth || 50;
-        let startHeight = nodesObj[start].height || 50;
-        let endWidth = nodesObj[end].width || 50;
-        let endInnerWidth = nodesObj[end].innerWidth || 50;
-        let endHeight = nodesObj[end].height || 50;
-        // 拐角半径
-        edge.radius = this.radius;
-        // 起始点
-        edge.startPoint = {
-            x: nodesObj[start].x + startWidth + ( startInnerWidth - startWidth ) / 2-data.minX,
-            y: nodesObj[start].y + startHeight / 2-data.minY,
-        };
-        // 结束点
-        edge.endPoint = {
-            x: nodesObj[end].x - ( endInnerWidth - endWidth ) / 2-data.minX,
-            y: nodesObj[end].y + endHeight / 2-data.minY,
-        };
-        let vDis = edge.endPoint.y - edge.startPoint.y;
-        // endPoint向左距离20点位置开始绘制曲线
-        let hDis = this.dis;
-
-        // radius 根据 vDis 大小而动态调整
-        if(Math.abs(vDis) <= this.radius * 2){
-            edge.radius = Math.abs(vDis) / 2;
-        }
-
-        let revise = edge.radius;
-        // 当end节点在start节点下方时，个别点的位置需要修正
-        if(edge.endPoint.y < edge.startPoint.y){
-            revise = -edge.radius
-        }
-        // 第一个圆弧起始点
-        edge.firstRoundStartPoint = {
-            x: edge.startPoint.x  + hDis,
-            y: edge.startPoint.y,
-        }
-        // 第一个圆弧控制点
-        edge.firstRoundControlPoint = {
-            x: edge.startPoint.x + hDis + edge.radius,
-            y: edge.startPoint.y,
-        }
-        // 第一个圆弧结束点
-        edge.firstRoundEndPoint = {
-            x: edge.startPoint.x + hDis + edge.radius,
-            y: edge.startPoint.y + revise,
-        };
-        // 第二个圆弧起始点
-        edge.secondRoundStartPoint = {
-            x: edge.startPoint.x + hDis + edge.radius,
-            y: edge.endPoint.y - revise,
-        };
-        // 第二个圆弧控制点
-        edge.secondRoundControlPoint = {
-            x: edge.startPoint.x + hDis + edge.radius,
-            y: edge.endPoint.y,
-        };
-        // 第二个圆弧结束点
-        edge.secondRoundEndPoint = {
-            x: edge.startPoint.x + hDis + edge.radius * 2,
-            y: edge.endPoint.y,
-        };
-    }
-
-    // 计算出以目标节点为对齐方式的连线数据 --- 纵向
-    setTargetDataV(targetEdge, data){
-        let end = targetEdge.target;
-        let start = targetEdge.source;
-        let nodesObj = data.nodesObj;
-        let startWidth = nodesObj[start].width || 50;
-        let startInnerHeight = nodesObj[start].innerHeight || 50;
-        let startHeight = nodesObj[start].height || 50;
-        let endWidth = nodesObj[end].width || 50;
-        let endInnerHeight = nodesObj[end].innerHeight || 50;
-        let endHeight = nodesObj[end].height || 50;
-        // 拐角半径
-        targetEdge.radius = this.radius;
-        // 起始点
-        targetEdge.startPoint = {
-            x: nodesObj[start].x + startWidth / 2-data.minX,
-            y: nodesObj[start].y + startHeight + ( startInnerHeight - startHeight ) / 2-data.minY,
-        };
-        // 结束点
-        targetEdge.endPoint = {
-            x: nodesObj[end].x + endWidth / 2-data.minX,
-            y: nodesObj[end].y - ( endInnerHeight - endHeight ) / 2-data.minY,
-        };
-        let hDis = targetEdge.endPoint.x - targetEdge.startPoint.x;
-        // endPoint向上距离20点位置开始绘制曲线
-        let vDis = this.dis;
-
-        // radius 根据 vDis 大小而动态调整
-        if(Math.abs(hDis) <= this.radius * 2){
-            targetEdge.radius = Math.abs(hDis) / 2;
-        }
-
-        let revise = targetEdge.radius;
-        // 当end节点在start节点左方时，个别点的位置需要修正
-        if(targetEdge.endPoint.x < targetEdge.startPoint.x){
-            revise = -targetEdge.radius
-        }
-        // 第一个圆弧起始点
-        targetEdge.firstRoundStartPoint = {
-            x: targetEdge.startPoint.x,
-            y: targetEdge.endPoint.y  - vDis - targetEdge.radius * 2,
-        }
-        // 第一个圆弧控制点
-        targetEdge.firstRoundControlPoint = {
-            x: targetEdge.startPoint.x,
-            y: targetEdge.endPoint.y  - vDis - targetEdge.radius,
-        }
-        // 第一个圆弧结束点
-        targetEdge.firstRoundEndPoint = {
-            x: targetEdge.startPoint.x + revise,
-            y: targetEdge.endPoint.y - vDis - targetEdge.radius,
-        };
-        // 第二个圆弧起始点
-        targetEdge.secondRoundStartPoint = {
-            x: targetEdge.endPoint.x - revise,
-            y: targetEdge.endPoint.y - vDis - targetEdge.radius,
-        };
-        // 第二个圆弧控制点
-        targetEdge.secondRoundControlPoint = {
-            x: targetEdge.endPoint.x,
-            y: targetEdge.endPoint.y - vDis - targetEdge.radius,
-        };
-        // 第二个圆弧结束点
-        targetEdge.secondRoundEndPoint = {
-            x: targetEdge.endPoint.x,
-            y: targetEdge.endPoint.y - vDis,
-        };
-    }
-
-    // 计算出以源头节点为对齐方式的连线数据  --- 纵向
-    setSourceDataV(edge, data){
-        let end = edge.target;
-        let start = edge.source;
-        let nodesObj = data.nodesObj;
-        let startWidth = nodesObj[start].width || 50;
-        let startInnerHeight = nodesObj[start].innerHeight || 50;
-        let startHeight = nodesObj[start].height || 50;
-        let endWidth = nodesObj[end].width || 50;
-        let endInnerHeight = nodesObj[end].innerHeight || 50;
-        let endHeight = nodesObj[end].height || 50;
-        // 拐角半径
-        edge.radius = this.radius;
-        // 起始点
-        edge.startPoint = {
-            x: nodesObj[start].x + startWidth / 2-data.minX,
-            y: nodesObj[start].y + startHeight  + ( startInnerHeight - startHeight ) / 2-data.minY,
-        };
-        // 结束点
-        edge.endPoint = {
-            x: nodesObj[end].x + endWidth / 2-data.minX,
-            y: nodesObj[end].y - ( endInnerHeight - endHeight ) / 2-data.minY,
-        };
-        let hDis = edge.endPoint.x - edge.startPoint.x;
-        // endPoint向上距离20点位置开始绘制曲线
-        let vDis = this.dis;
-
-        // radius 根据 vDis 大小而动态调整
-        if(Math.abs(hDis) <= this.radius * 2){
-            edge.radius = Math.abs(hDis) / 2;
-        }
-
-        let revise = edge.radius;
-        // 当end节点在start节点左方时，个别点的位置需要修正
-        if(edge.endPoint.x < edge.startPoint.x){
-            revise = -edge.radius
-        }
-        // 第一个圆弧起始点
-        edge.firstRoundStartPoint = {
-            x: edge.startPoint.x,
-            y: edge.startPoint.y  + vDis,
-        }
-        // 第一个圆弧控制点
-        edge.firstRoundControlPoint = {
-            x: edge.startPoint.x,
-            y: edge.startPoint.y  + vDis + edge.radius,
-        }
-        // 第一个圆弧结束点
-        edge.firstRoundEndPoint = {
-            x: edge.startPoint.x + revise,
-            y: edge.startPoint.y  + vDis + edge.radius,
-        };
-        // 第二个圆弧起始点
-        edge.secondRoundStartPoint = {
-            x: edge.endPoint.x - revise,
-            y: edge.startPoint.y  + vDis + edge.radius,
-        };
-        // 第二个圆弧控制点
-        edge.secondRoundControlPoint = {
-            x: edge.endPoint.x,
-            y: edge.startPoint.y  + vDis + edge.radius,
-        };
-        // 第二个圆弧结束点
-        edge.secondRoundEndPoint = {
-            x: edge.endPoint.x,
-            y: edge.startPoint.y  + vDis + edge.radius * 2,
-        };
-    }
-
-    setPath (edge){
-        let m =  `M${edge.startPoint.x} ${edge.startPoint.y}`;
-        let l1 = `L${edge.firstRoundStartPoint.x} ${edge.firstRoundStartPoint.y}`;
-        let q1 = `Q${edge.firstRoundControlPoint.x} ${edge.firstRoundControlPoint.y} ${edge.firstRoundEndPoint.x} ${edge.firstRoundEndPoint.y}`;
-        let l2 = `L${edge.secondRoundStartPoint.x} ${edge.secondRoundStartPoint.y}`;
-        let q2 = `Q${edge.secondRoundControlPoint.x} ${edge.secondRoundControlPoint.y} ${edge.secondRoundEndPoint.x} ${edge.secondRoundEndPoint.y}`;
-        let l3 = `L${edge.endPoint.x} ${edge.endPoint.y}`;
-        return `${m} ${l1} ${q1} ${l2} ${q2} ${l3}`;
-    }
-}