@antv/g - npm Package Compare versions

Comparing version 3.1.0-beta.10 to 3.1.0-beta.11

lib/core/element.js

@@ -16,3 +16,2 @@ var Util = require('../util/index');
   Util.assign(this._cfg, this.getDefaultCfg(), cfg); // Element.CFG不合并，提升性能 合并默认配置，用户配置->继承默认配置->Element默认配置
-  // 在子元素的init中创建新svg元素，然后设置属性和变换。在这边设置id而不是attr里，是考虑id一旦设置后应不能修改
   this.initAttrs(this._cfg.attrs); // 初始化绘图属性
@@ -19,0 +18,0 @@ this._cfg.attrs = {};

lib/core/group.js

@@ -211,4 +211,5 @@ var Util = require('../util/index');
   _setCfgProperty: function _setCfgProperty(item) {
+    var cfg = this._cfg;
     item.set('parent', this);
-    var cfg = this._cfg;
+    item.set('canvas', cfg.canvas);
     if (cfg.timeline) {
@@ -215,0 +216,0 @@ item.set('timeline', cfg.timeline);

lib/core/mixin/timeline.js

@@ -33,4 +33,17 @@ var Util = require('../../util/index');
       if (k === 'path') {
-        var toPath = PathUtil.parsePathString(toAttrs[k]); // 终点状态
-        var fromPath = PathUtil.parsePathString(fromAttrs[k]); // 起始状态
+        var toPath = toAttrs[k];
+        var fromPath = fromAttrs[k];
+        if (toPath.length > fromPath.length) {
+          toPath = PathUtil.parsePathString(toAttrs[k]); // 终点状态
+          fromPath = PathUtil.parsePathString(fromAttrs[k]); // 起始状态
+          fromPath = PathUtil.fillPathByDiff(fromPath, toPath);
+          fromPath = PathUtil.formatPath(fromPath, toPath);
+          animator.fromAttrs.path = fromPath;
+          animator.toAttrs.path = toPath;
+        } else if (!animator.pathFormatted) {
+          fromPath = PathUtil.formatPath(fromPath, toPath);
+          animator.fromAttrs.path = fromPath;
+          animator.toAttrs.path = toPath;
+          animator.pathFormatted = true;
+        }
         cProps[k] = [];
@@ -72,3 +85,2 @@ for (var i = 0; i < toPath.length; i++) {
   var ratio = void 0;
-  var isFinished = false;
   var duration = animator.duration;
@@ -86,4 +98,7 @@ var easing = animator.easing;
     } else {
-      ratio = 1;
-      isFinished = true;
+      shape.attr(animator.toAttrs);
+      if (animator.toMatrix) {
+        shape.setMatrix(animator.toMatrix);
+      }
+      return true;
     }
@@ -93,3 +108,3 @@ }
   _update(shape, animator, ratio);
-  return isFinished;
+  return false;
 }
@@ -96,0 +111,0 @@

lib/index.js

@@ -26,3 +26,3 @@ module.exports = {
   // version, etc.
-  version: '3.1.0-beta.10'
+  version: '3.1.0-beta.11'
 };

lib/renderers/svg/painter.js

@@ -135,3 +135,5 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
      */
-    redraw = redraw || !!cfg.el;
+    if (!cfg.el && cfg.attrs) {
+      redraw = true;
+    }
     if (cfg.tobeRemoved) {
@@ -355,4 +357,2 @@ Util.each(cfg.tobeRemoved, function (item) {
     var shape = document.createElementNS('http://www.w3.org/2000/svg', type);
-    var id = model._attrs.id || Util.uniqueId(this.type + '_');
-    shape.id = id;
     model._cfg.el = shape;
@@ -359,0 +359,0 @@ if (model._cfg.parent) {

lib/shapes/path.js

@@ -250,2 +250,5 @@ var Util = require('../util/index');
     }
+    if (segments.length === 1) {
+      return;
+    }
     if (!attrs.startArrow && !attrs.endArrow) {
@@ -252,0 +255,0 @@ return;

lib/util/path.js

@@ -893,2 +893,383 @@ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
 
+function decasteljau(points, t) {
+  var left = [];
+  var right = [];
+
+  function recurse(points, t) {
+    if (points.length === 1) {
+      left.push(points[0]);
+      right.push(points[0]);
+    } else {
+      var middlePoints = [];
+      for (var i = 0; i < points.length - 1; i++) {
+        if (i === 0) {
+          left.push(points[0]);
+        }
+        if (i === points.length - 2) {
+          right.push(points[i + 1]);
+        }
+        middlePoints[i] = [(1 - t) * points[i][0] + t * points[i + 1][0], (1 - t) * points[i][1] + t * points[i + 1][1]];
+      }
+      recurse(middlePoints, t);
+    }
+  }
+  if (points.length) {
+    recurse(points, t);
+  }
+  return { left: left, right: right.reverse() };
+}
+
+function splitCurve(start, end, count) {
+  var points = [[start[1], start[2]]];
+  count = count || 2;
+  var segments = [];
+  if (end[0] === 'A') {
+    points.push(end[6]);
+    points.push(end[7]);
+  } else if (end[0] === 'C') {
+    points.push([end[1], end[2]]);
+    points.push([end[3], end[4]]);
+    points.push([end[5], end[6]]);
+  } else if (end[0] === 'S' || end[0] === 'Q') {
+    points.push([end[1], end[2]]);
+    points.push([end[3], end[4]]);
+  } else {
+    points.push([end[1], end[2]]);
+  }
+
+  var leftSegments = points;
+  var t = 1 / count;
+
+  for (var i = 0; i < count - 1; i++) {
+    var rt = t / (1 - t * i);
+    var split = decasteljau(leftSegments, rt);
+    segments.push(split.left);
+    leftSegments = split.right;
+  }
+  segments.push(leftSegments);
+  var result = segments.map(function (segment) {
+    var cmd = [];
+    if (segment.length === 4) {
+      cmd.push('C');
+      cmd = cmd.concat(segment[2]);
+    }
+    if (segment.length >= 3) {
+      if (segment.length === 3) {
+        cmd.push('Q');
+      }
+      cmd = cmd.concat(segment[1]);
+    }
+    if (segment.length === 2) {
+      cmd.push('L');
+    }
+    cmd = cmd.concat(segment[segment.length - 1]);
+    return cmd;
+  });
+  return result;
+}
+
+var splitSegment = function splitSegment(start, end, count) {
+  if (count === 1) {
+    return [[].concat(start)];
+  }
+  var segments = [];
+  if (end[0] === 'L' || end[0] === 'C' || end[0] === 'Q') {
+    segments = segments.concat(splitCurve(start, end, count));
+  } else {
+    var temp = [].concat(start);
+    if (temp[0] === 'M') {
+      temp[0] = 'L';
+    }
+    for (var i = 0; i <= count - 1; i++) {
+      segments.push(temp);
+    }
+  }
+  return segments;
+};
+
+var fillPath = function fillPath(source, target) {
+  if (source.length === 1) {
+    return source;
+  }
+  var sourceLen = source.length - 1;
+  var targetLen = target.length - 1;
+  var ratio = sourceLen / targetLen;
+  var segmentsToFill = [];
+  if (source.length === 1 && source[0][0] === 'M') {
+    for (var i = 0; i < targetLen - sourceLen; i++) {
+      source.push(source[0]);
+    }
+    return source;
+  }
+  for (var _i3 = 0; _i3 < targetLen; _i3++) {
+    var index = Math.floor(ratio * _i3);
+    segmentsToFill[index] = (segmentsToFill[index] || 0) + 1;
+  }
+  var filled = segmentsToFill.reduce(function (filled, count, i) {
+    if (i === sourceLen) {
+      return filled.concat(source[sourceLen]);
+    }
+    return filled.concat(splitSegment(source[i], source[i + 1], count));
+  }, []);
+  filled.unshift(source[0]);
+  if (target[targetLen] === 'Z' || target[targetLen] === 'z') {
+    filled.push('Z');
+  }
+  return filled;
+};
+
+var isEqual = function isEqual(obj1, obj2) {
+  if (obj1.length !== obj2.length) {
+    return false;
+  }
+  var result = true;
+  Util.each(obj1, function (item, i) {
+    if (item !== obj2[i]) {
+      result = false;
+      return false;
+    }
+  });
+  return result;
+};
+function getMinDiff(del, add, modify) {
+  var type = null;
+  var min = modify;
+  if (add < min) {
+    min = add;
+    type = 'add';
+  }
+  if (del < min) {
+    min = del;
+    type = 'del';
+  }
+  return {
+    type: type,
+    min: min
+  };
+}
+
+/*
+ * https://en.wikipedia.org/wiki/Levenshtein_distance
+ * 计算两条path的编辑距离
+ */
+var levenshteinDistance = function levenshteinDistance(source, target) {
+  var sourceLen = source.length;
+  var targetLen = target.length;
+  var sourceSegment = void 0,
+      targetSegment = void 0;
+  var temp = 0;
+  if (sourceLen === 0 || targetLen === 0) {
+    return null;
+  }
+  var dist = [];
+  for (var i = 0; i <= sourceLen; i++) {
+    dist[i] = [];
+    dist[i][0] = { min: i };
+  }
+  for (var j = 0; j <= targetLen; j++) {
+    dist[0][j] = { min: j };
+  }
+
+  for (var _i4 = 1; _i4 <= sourceLen; _i4++) {
+    sourceSegment = source[_i4 - 1];
+    for (var _j2 = 1; _j2 <= targetLen; _j2++) {
+      targetSegment = target[_j2 - 1];
+      if (isEqual(sourceSegment, targetSegment)) {
+        temp = 0;
+      } else {
+        temp = 1;
+      }
+      var del = dist[_i4 - 1][_j2].min + 1;
+      var add = dist[_i4][_j2 - 1].min + 1;
+      var modify = dist[_i4 - 1][_j2 - 1].min + temp;
+      dist[_i4][_j2] = getMinDiff(del, add, modify);
+    }
+  }
+  return dist;
+};
+
+var fillPathByDiff = function fillPathByDiff(source, target) {
+  var diffMatrix = levenshteinDistance(source, target);
+  var sourceLen = source.length;
+  var targetLen = target.length;
+  var changes = [];
+  var index = 1;
+  var minPos = 1;
+  // 如果source和target不是完全不相等
+  if (diffMatrix[sourceLen][targetLen] !== sourceLen) {
+    // 获取从source到target所需改动
+    for (var i = 1; i <= sourceLen; i++) {
+      var min = diffMatrix[i][i].min;
+      minPos = i;
+      for (var j = index; j <= targetLen; j++) {
+        if (diffMatrix[i][j].min < min) {
+          min = diffMatrix[i][j].min;
+          minPos = j;
+        }
+      }
+      index = minPos;
+      if (diffMatrix[i][index].type) {
+        changes.push({ index: i - 1, type: diffMatrix[i][index].type });
+      }
+    }
+    // 对source进行增删path
+    for (var _i5 = changes.length - 1; _i5 >= 0; _i5--) {
+      index = changes[_i5].index;
+      if (changes[_i5].type === 'add') {
+        source.splice(index, 0, [].concat(source[index]));
+      } else {
+        source.splice(index, 1);
+      }
+    }
+  }
+
+  // source尾部补齐
+  sourceLen = source.length;
+  if (sourceLen < targetLen) {
+    for (var _i6 = 0; _i6 < targetLen - sourceLen; _i6++) {
+      if (source[sourceLen - 1][0] === 'z' || source[sourceLen - 1][0] === 'Z') {
+        source.splice(sourceLen - 2, 0, source[sourceLen - 2]);
+      } else {
+        source.push(source[sourceLen - 1]);
+      }
+    }
+  }
+  return source;
+};
+
+// 将两个点均分成count个点
+function _splitPoints(points, former, count) {
+  var result = [].concat(points);
+  var index = void 0;
+  var t = 1 / (count + 1);
+  var formerEnd = _getSegmentPoints(former)[0];
+  for (var i = 1; i <= count; i++) {
+    t *= i;
+    index = Math.floor(points.length * t);
+    if (index === 0) {
+      result.unshift([formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t)]);
+    } else {
+      result.splice(index, 0, [formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t)]);
+    }
+  }
+  return result;
+}
+
+/*
+ * 抽取pathSegment中的关键点
+ * M,L,A,Q,H,V一个端点
+ * Q, S抽取一个端点，一个控制点
+ * C抽取一个端点，两个控制点
+ */
+function _getSegmentPoints(segment) {
+  var points = [];
+  switch (segment[0]) {
+    case 'M':
+      points.push([segment[1], segment[2]]);
+      break;
+    case 'L':
+      points.push([segment[1], segment[2]]);
+      break;
+    case 'A':
+      points.push([segment[6], segment[7]]);
+      break;
+    case 'Q':
+      points.push([segment[3], segment[4]]);
+      points.push([segment[1], segment[2]]);
+      break;
+    case 'T':
+      points.push([segment[1], segment[2]]);
+      break;
+    case 'C':
+      points.push([segment[5], segment[6]]);
+      points.push([segment[1], segment[2]]);
+      points.push([segment[3], segment[4]]);
+      break;
+    case 'S':
+      points.push([segment[3], segment[4]]);
+      points.push([segment[1], segment[2]]);
+      break;
+    case 'H':
+      points.push([segment[1], segment[1]]);
+      break;
+    case 'V':
+      points.push([segment[1], segment[1]]);
+      break;
+    default:
+
+  }
+  return points;
+}
+
+var formatPath = function formatPath(fromPath, toPath) {
+  if (fromPath.length <= 1) {
+    return fromPath;
+  }
+  var points = void 0;
+  for (var i = 0; i < toPath.length; i++) {
+    if (fromPath[i][0] !== toPath[i][0]) {
+      // 获取fromPath的pathSegment的端点，根据toPath的指令对其改造
+      points = _getSegmentPoints(fromPath[i]);
+      switch (toPath[i][0]) {
+        case 'M':
+          fromPath[i] = ['M'].concat(points[0]);
+          break;
+        case 'L':
+          fromPath[i] = ['L'].concat(points[0]);
+          break;
+        case 'A':
+          fromPath[i] = [].concat(toPath[i]);
+          fromPath[i][6] = points[0][0];
+          fromPath[i][7] = points[0][1];
+          break;
+        case 'Q':
+          if (points.length < 2) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 1);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = ['Q'].concat(points.reduce(function (arr, i) {
+            return arr.concat(i);
+          }, []));
+          break;
+        case 'T':
+          fromPath[i] = ['T'].concat(points[0]);
+          break;
+        case 'C':
+          if (points.length < 3) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 2);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = ['C'].concat(points.reduce(function (arr, i) {
+            return arr.concat(i);
+          }, []));
+          break;
+        case 'S':
+          if (points.length < 2) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 1);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = ['S'].concat(points.reduce(function (arr, i) {
+            return arr.concat(i);
+          }, []));
+          break;
+        default:
+          fromPath[i] = toPath[i];
+      }
+    }
+  }
+  return fromPath;
+};
+
 module.exports = {
@@ -901,3 +1282,6 @@ parsePathString: parsePathString,
   rectPath: rectPath,
+  fillPath: fillPath,
+  fillPathByDiff: fillPathByDiff,
+  formatPath: formatPath,
   intersection: pathIntersection
 };

package.json

 {
   "name": "@antv/g",
-  "version": "3.1.0-beta.10",
+  "version": "3.1.0-beta.11",
   "description": "A canvas library which providing 2d draw for G2.",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -306,9 +306,12 @@ # G
     * true / false: 显示 / 取消默认箭头
-    * 支持定义Marker形状的箭头，箭头中心位于线段的端点
+    * 支持定义箭头样式，箭头中心位于(0, 0)点，箭头指向与x轴正方向相同
+      * path: 箭头样式
+      * d: path方向上箭头的位移
     ```js
     canvas.addShape('path', {
       attrs: {
-        startArrow: new Marker({
-           attrs: { ... }  
-        })
+        startArrow: {
+          path: 'M 10,0 L -10,-10 L -10,10 Z',
+          d: 10
+        }
       }
@@ -315,0 +318,0 @@ });

src/core/element.js

@@ -16,3 +16,2 @@ const Util = require('../util/index');
   Util.assign(this._cfg, this.getDefaultCfg(), cfg); // Element.CFG不合并，提升性能 合并默认配置，用户配置->继承默认配置->Element默认配置
-  // 在子元素的init中创建新svg元素，然后设置属性和变换。在这边设置id而不是attr里，是考虑id一旦设置后应不能修改
   this.initAttrs(this._cfg.attrs); // 初始化绘图属性
@@ -19,0 +18,0 @@ this._cfg.attrs = {};

src/core/group.js

@@ -207,4 +207,5 @@ const Util = require('../util/index');
   _setCfgProperty(item) {
+    const cfg = this._cfg;
     item.set('parent', this);
-    const cfg = this._cfg;
+    item.set('canvas', cfg.canvas);
     if (cfg.timeline) {
@@ -211,0 +212,0 @@ item.set('timeline', cfg.timeline);

src/core/mixin/timeline.js

@@ -30,4 +30,17 @@ const Util = require('../../util/index');
       if (k === 'path') {
-        const toPath = PathUtil.parsePathString(toAttrs[k]); // 终点状态
-        const fromPath = PathUtil.parsePathString(fromAttrs[k]); // 起始状态
+        let toPath = toAttrs[k];
+        let fromPath = fromAttrs[k];
+        if (toPath.length > fromPath.length) {
+          toPath = PathUtil.parsePathString(toAttrs[k]); // 终点状态
+          fromPath = PathUtil.parsePathString(fromAttrs[k]); // 起始状态
+          fromPath = PathUtil.fillPathByDiff(fromPath, toPath);
+          fromPath = PathUtil.formatPath(fromPath, toPath);
+          animator.fromAttrs.path = fromPath;
+          animator.toAttrs.path = toPath;
+        } else if (!animator.pathFormatted) {
+          fromPath = PathUtil.formatPath(fromPath, toPath);
+          animator.fromAttrs.path = fromPath;
+          animator.toAttrs.path = toPath;
+          animator.pathFormatted = true;
+        }
         cProps[k] = [];
@@ -69,3 +82,2 @@ for (let i = 0; i < toPath.length; i++) {
   let ratio;
-  let isFinished = false;
   const duration = animator.duration;
@@ -83,4 +95,7 @@ const easing = animator.easing;
     } else {
-      ratio = 1;
-      isFinished = true;
+      shape.attr(animator.toAttrs);
+      if (animator.toMatrix) {
+        shape.setMatrix(animator.toMatrix);
+      }
+      return true;
     }
@@ -90,3 +105,3 @@ }
   _update(shape, animator, ratio);
-  return isFinished;
+  return false;
 }
@@ -93,0 +108,0 @@

src/index.js

@@ -26,3 +26,3 @@ module.exports = {
   // version, etc.
-  version: '3.1.0-beta.10'
+  version: '3.1.0-beta.11'
 };

src/renderers/svg/painter.js

@@ -124,3 +124,5 @@ const Util = require('../../util');
      */
-    redraw = redraw || !!cfg.el;
+    if (!cfg.el && cfg.attrs) {
+      redraw = true;
+    }
     if (cfg.tobeRemoved) {
@@ -337,4 +339,2 @@ Util.each(cfg.tobeRemoved, item => {
     const shape = document.createElementNS('http://www.w3.org/2000/svg', type);
-    const id = model._attrs.id || Util.uniqueId(this.type + '_');
-    shape.id = id;
     model._cfg.el = shape;
@@ -341,0 +341,0 @@ if (model._cfg.parent) {

src/shapes/path.js

@@ -254,2 +254,5 @@ const Util = require('../util/index');
     }
+    if (segments.length === 1) {
+      return;
+    }
     if (!attrs.startArrow && !attrs.endArrow) {
@@ -256,0 +259,0 @@ return;

src/util/path.js

@@ -957,2 +957,378 @@ const Util = require('./common');
 
+function decasteljau(points, t) {
+  const left = [];
+  const right = [];
+
+  function recurse(points, t) {
+    if (points.length === 1) {
+      left.push(points[0]);
+      right.push(points[0]);
+    } else {
+      const middlePoints = [];
+      for (let i = 0; i < points.length - 1; i++) {
+        if (i === 0) {
+          left.push(points[0]);
+        }
+        if (i === points.length - 2) {
+          right.push(points[i + 1]);
+        }
+        middlePoints[i] = [ (1 - t) * points[i][0] + t * points[i + 1][0], (1 - t) * points[i][1] + t * points[i + 1][1] ];
+      }
+      recurse(middlePoints, t);
+    }
+  }
+  if (points.length) {
+    recurse(points, t);
+  }
+  return { left, right: right.reverse() };
+}
+
+function splitCurve(start, end, count) {
+  const points = [[ start[1], start[2] ]];
+  count = count || 2;
+  const segments = [];
+  if (end[0] === 'A') {
+    points.push(end[6]);
+    points.push(end[7]);
+  } else if (end[0] === 'C') {
+    points.push([ end[1], end[2] ]);
+    points.push([ end[3], end[4] ]);
+    points.push([ end[5], end[6] ]);
+  } else if (end[0] === 'S' || end[0] === 'Q') {
+    points.push([ end[1], end[2] ]);
+    points.push([ end[3], end[4] ]);
+  } else {
+    points.push([ end[1], end[2] ]);
+  }
+
+  let leftSegments = points;
+  const t = 1 / count;
+
+  for (let i = 0; i < count - 1; i++) {
+    const rt = t / (1 - t * i);
+    const split = decasteljau(leftSegments, rt);
+    segments.push(split.left);
+    leftSegments = split.right;
+  }
+  segments.push(leftSegments);
+  const result = segments.map(segment => {
+    let cmd = [];
+    if (segment.length === 4) {
+      cmd.push('C');
+      cmd = cmd.concat(segment[2]);
+    }
+    if (segment.length >= 3) {
+      if (segment.length === 3) {
+        cmd.push('Q');
+      }
+      cmd = cmd.concat(segment[1]);
+    }
+    if (segment.length === 2) {
+      cmd.push('L');
+    }
+    cmd = cmd.concat(segment[segment.length - 1]);
+    return cmd;
+  });
+  return result;
+}
+
+const splitSegment = function(start, end, count) {
+  if (count === 1) {
+    return [ [].concat(start) ];
+  }
+  let segments = [];
+  if (end[0] === 'L' || end[0] === 'C' || end[0] === 'Q') {
+    segments = segments.concat(splitCurve(start, end, count));
+  } else {
+    const temp = [].concat(start);
+    if (temp[0] === 'M') {
+      temp[0] = 'L';
+    }
+    for (let i = 0; i <= count - 1; i++) {
+      segments.push(temp);
+    }
+  }
+  return segments;
+};
+
+const fillPath = function(source, target) {
+  if (source.length === 1) {
+    return source;
+  }
+  const sourceLen = source.length - 1;
+  const targetLen = target.length - 1;
+  const ratio = sourceLen / targetLen;
+  const segmentsToFill = [];
+  if (source.length === 1 && source[0][0] === 'M') {
+    for (let i = 0; i < targetLen - sourceLen; i++) {
+      source.push(source[0]);
+    }
+    return source;
+  }
+  for (let i = 0; i < targetLen; i++) {
+    const index = Math.floor(ratio * i);
+    segmentsToFill[index] = (segmentsToFill[index] || 0) + 1;
+  }
+  const filled = segmentsToFill.reduce((filled, count, i) => {
+    if (i === sourceLen) {
+      return filled.concat(source[sourceLen]);
+    }
+    return filled.concat(splitSegment(source[i], source[i + 1], count));
+  }, []);
+  filled.unshift(source[0]);
+  if (target[targetLen] === 'Z' || target[targetLen] === 'z') {
+    filled.push('Z');
+  }
+  return filled;
+};
+
+const isEqual = function(obj1, obj2) {
+  if (obj1.length !== obj2.length) {
+    return false;
+  }
+  let result = true;
+  Util.each(obj1, (item, i) => {
+    if (item !== obj2[i]) {
+      result = false;
+      return false;
+    }
+  });
+  return result;
+};
+function getMinDiff(del, add, modify) {
+  let type = null;
+  let min = modify;
+  if (add < min) {
+    min = add;
+    type = 'add';
+  }
+  if (del < min) {
+    min = del;
+    type = 'del';
+  }
+  return {
+    type,
+    min
+  };
+}
+
+/*
+ * https://en.wikipedia.org/wiki/Levenshtein_distance
+ * 计算两条path的编辑距离
+ */
+const levenshteinDistance = function(source, target) {
+  const sourceLen = source.length;
+  const targetLen = target.length;
+  let sourceSegment,
+    targetSegment;
+  let temp = 0;
+  if (sourceLen === 0 || targetLen === 0) {
+    return null;
+  }
+  const dist = [];
+  for (let i = 0; i <= sourceLen; i++) {
+    dist[i] = [];
+    dist[i][0] = { min: i };
+  }
+  for (let j = 0; j <= targetLen; j++) {
+    dist[0][j] = { min: j };
+  }
+
+  for (let i = 1; i <= sourceLen; i++) {
+    sourceSegment = source[i - 1];
+    for (let j = 1; j <= targetLen; j++) {
+      targetSegment = target[j - 1];
+      if (isEqual(sourceSegment, targetSegment)) {
+        temp = 0;
+      } else {
+        temp = 1;
+      }
+      const del = dist[i - 1][j].min + 1;
+      const add = dist[i][j - 1].min + 1;
+      const modify = dist[i - 1][j - 1].min + temp;
+      dist[i][j] = getMinDiff(del, add, modify);
+    }
+  }
+  return dist;
+};
+
+const fillPathByDiff = function(source, target) {
+  const diffMatrix = levenshteinDistance(source, target);
+  let sourceLen = source.length;
+  const targetLen = target.length;
+  const changes = [];
+  let index = 1;
+  let minPos = 1;
+  // 如果source和target不是完全不相等
+  if (diffMatrix[sourceLen][targetLen] !== sourceLen) {
+    // 获取从source到target所需改动
+    for (let i = 1; i <= sourceLen; i++) {
+      let min = diffMatrix[i][i].min;
+      minPos = i;
+      for (let j = index; j <= targetLen; j++) {
+        if (diffMatrix[i][j].min < min) {
+          min = diffMatrix[i][j].min;
+          minPos = j;
+        }
+      }
+      index = minPos;
+      if (diffMatrix[i][index].type) {
+        changes.push({ index: i - 1, type: diffMatrix[i][index].type });
+      }
+    }
+    // 对source进行增删path
+    for (let i = changes.length - 1; i >= 0; i--) {
+      index = changes[i].index;
+      if (changes[i].type === 'add') {
+        source.splice(index, 0, [].concat(source[index]));
+      } else {
+        source.splice(index, 1);
+      }
+    }
+  }
+
+  // source尾部补齐
+  sourceLen = source.length;
+  if (sourceLen < targetLen) {
+    for (let i = 0; i < (targetLen - sourceLen); i++) {
+      if (source[sourceLen - 1][0] === 'z' || source[sourceLen - 1][0] === 'Z') {
+        source.splice(sourceLen - 2, 0, source[sourceLen - 2]);
+      } else {
+        source.push(source[sourceLen - 1]);
+      }
+
+    }
+  }
+  return source;
+};
+
+// 将两个点均分成count个点
+function _splitPoints(points, former, count) {
+  const result = [].concat(points);
+  let index;
+  let t = 1 / (count + 1);
+  const formerEnd = _getSegmentPoints(former)[0];
+  for (let i = 1; i <= count; i++) {
+    t *= i;
+    index = Math.floor(points.length * t);
+    if (index === 0) {
+      result.unshift([ formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t) ]);
+    } else {
+      result.splice(index, 0, [ formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t) ]);
+    }
+  }
+  return result;
+}
+
+/*
+ * 抽取pathSegment中的关键点
+ * M,L,A,Q,H,V一个端点
+ * Q, S抽取一个端点，一个控制点
+ * C抽取一个端点，两个控制点
+ */
+function _getSegmentPoints(segment) {
+  const points = [];
+  switch (segment[0]) {
+    case 'M':
+      points.push([ segment[1], segment[2] ]);
+      break;
+    case 'L':
+      points.push([ segment[1], segment[2] ]);
+      break;
+    case 'A':
+      points.push([ segment[6], segment[7] ]);
+      break;
+    case 'Q':
+      points.push([ segment[3], segment[4] ]);
+      points.push([ segment[1], segment[2] ]);
+      break;
+    case 'T':
+      points.push([ segment[1], segment[2] ]);
+      break;
+    case 'C':
+      points.push([ segment[5], segment[6] ]);
+      points.push([ segment[1], segment[2] ]);
+      points.push([ segment[3], segment[4] ]);
+      break;
+    case 'S':
+      points.push([ segment[3], segment[4] ]);
+      points.push([ segment[1], segment[2] ]);
+      break;
+    case 'H':
+      points.push([ segment[1], segment[1] ]);
+      break;
+    case 'V':
+      points.push([ segment[1], segment[1] ]);
+      break;
+    default:
+
+  }
+  return points;
+}
+
+const formatPath = function(fromPath, toPath) {
+  if (fromPath.length <= 1) {
+    return fromPath;
+  }
+  let points;
+  for (let i = 0; i < toPath.length; i++) {
+    if (fromPath[i][0] !== toPath[i][0]) {
+      // 获取fromPath的pathSegment的端点，根据toPath的指令对其改造
+      points = _getSegmentPoints(fromPath[i]);
+      switch (toPath[i][0]) {
+        case 'M':
+          fromPath[i] = [ 'M' ].concat(points[0]);
+          break;
+        case 'L':
+          fromPath[i] = [ 'L' ].concat(points[0]);
+          break;
+        case 'A':
+          fromPath[i] = [].concat(toPath[i]);
+          fromPath[i][6] = points[0][0];
+          fromPath[i][7] = points[0][1];
+          break;
+        case 'Q':
+          if (points.length < 2) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 1);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = [ 'Q' ].concat(points.reduce((arr, i) => { return arr.concat(i); }, []));
+          break;
+        case 'T':
+          fromPath[i] = [ 'T' ].concat(points[0]);
+          break;
+        case 'C':
+          if (points.length < 3) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 2);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = [ 'C' ].concat(points.reduce((arr, i) => { return arr.concat(i); }, []));
+          break;
+        case 'S':
+          if (points.length < 2) {
+            if (i > 0) {
+              points = _splitPoints(points, fromPath[i - 1], 1);
+            } else {
+              fromPath[i] = toPath[i];
+              break;
+            }
+          }
+          fromPath[i] = [ 'S' ].concat(points.reduce((arr, i) => { return arr.concat(i); }, []));
+          break;
+        default:
+          fromPath[i] = toPath[i];
+      }
+    }
+  }
+  return fromPath;
+};
+
 module.exports = {
@@ -965,3 +1341,6 @@ parsePathString,
   rectPath,
+  fillPath,
+  fillPathByDiff,
+  formatPath,
   intersection: pathIntersection
 };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1098515

increased by5.64%

Number of package files

130

increased by1.56%

Lines of code

28576

increased by4.2%

Number of lines in readme file

547

increased by0.55%

No dependency changes