0

我是 svg 和 js 的新手。我有一些使用压敏笔绘制的 svg 文件，它们的路径里面有填充，并且有重复的路径（包含填充）。在 Illustrator 中，您可以选择整个路径，然后将笔更改为基本笔（无压力感应），这会将路径更改为简单路径（每行没有重复路径的路径）。下面的 svg 示例显示每条线有 2 条并行路径：

http://jsfiddle.net/Y35sV/10/

https://dl.dropboxusercontent.com/u/140225334/face.svg

我正在考虑使用 snap svg 更改每个路径的 d 属性。请注意，小路径已被手动剪切为单个路径。

path.attr({

'd' = 'value'

});// Any ideas on how to get the right value for the d?

如何以与 Illustrator 相同的方式删除每行的第二条路径，但请以编程方式使用 js？

任何想法将不胜感激。

****更新：

我做了一些研究并解决了这个问题，这是我的发现：

1-我需要将所有子路径转换为路径，并将所有路径转换为绝对值。（这部分已经由 Ian 完成）

这里：http: //jsbin.com/fiwofukitegu/2/edit

2-然后我应该计算每个路径段的 C 数量，并有一个检查功能来检查 C 命令的数量是偶数还是奇数，

像这样的东西：

for each M 
var cValue =C. count();
function isEven(value) {
    if (value%2 == 0)
        return true;
    else
        return false;
}

3-我实际上手动检查了这个：

如果每个路径段中 C 的数量是偶数，例如 2 ,4, 6,8,10,... 我应该先计算它们，然后从 2、3、4、5、6 C 及其以下位数。

4-如果每个路径段中C的数量是奇数

像 1, 3,5,7,9,...我应该先计算它们，然后从 1,2,3,4,5 C 及其后面的数字中删除。

那么结果将是一个只有一行的路径段，而不是重复的行。

我非常感谢任何是 js 专家并愿意帮助完成这项工作的人！

4

1 回答 1

0

我认为你必须解析你的“d”路径。为此，您可以查看它是如何在 snapjs 中完成的，或者使用类似这样的代码 https://github.com/jkroso/parse-svg-path

/* jkroso/parse-svg-path */



var parseSvgPath = function(path){

/**
* expected argument lengths
* @type {Object}
*/
    this.length = {a: 7, c: 6, h: 1, l: 2, m: 2, q: 4, s: 4, t: 2, v: 1, z: 0};
    /**
    * segment pattern
    * @type {RegExp}
    */
    this.segment = /([astvzqmhlc])([^astvzqmhlc]*)/ig;

    this.parseValues = function(args){
        args = args.match(/-?[.0-9]+(?:e[-+]?\d+)?/ig);
        return args ? args.map(Number) : [];
    };

    /**
    * parse an svg path data string. Generates an Array
    * of commands where each command is an Array of the
    * form `[command, arg1, arg2, ...]`
    *
    * @param {String} path
    * @return {Array}
    */
this.parse = function(path) {
    var data = [];
    path.replace(this.segment, function(_, command, args){
        var type = command.toLowerCase();
        args = this.parseValues(args);
        // overloaded moveTo
        if (type == 'm' && args.length > 2) {
            data.push([command].concat(args.splice(0, 2)));
            type = 'l';
            command = command == 'm' ? 'l' : 'L';
        }
        while (true) {
            if (args.length == this.length[type]) {
                args.unshift(command);
                return data.push(args);
            }
            if (args.length < this.length[type]) throw new Error('malformed path data');
            data.push([command].concat(args.splice(0, this.length[type])));
        }
    })
    return data;
    };

    return this.parse(path);
};
于 2014-09-06T17:20:25.953 回答