评论在SVG路径

我与jQuery和SVG实验，我做了我的道路，但现在我想改变这种状况（基于一些用户输入）我做这样的事情评论在SVG路径

 
    var dpath = $('path').attr("d"); 
    $('path').attr("d",dpath.replace("150 150", "450 450"));

工作正常，但是这当我的路径增长时没有用，所以我想知道是否有可能将标签或注释放在路径中作为替换钩子？搜索“svg路径评论”的以“评论”的形式向我提供论坛中的所有条目，这不是非常有用。我接近编写自己的“可替换”伪svg路径代码，但在svg中有没有其他可能的替代方案？关于， Jeroen。

来源

2010-04-04 dr jerry

SVG具有到非序列化形式的路径元素的接口。它的描述在the SVG spec。您应该可以通过添加自己的属性来充当标记来扩展对象。

我从来没有使用的界面，但你应该能够使用pathSegList属性（在SVGAnimatedPathData定义）由沿$("path")[0].pathSegList的线（[0]做一些访问路径段的名单是那里得到到实际DOM元素而不是jQuery对象）

来源

2010-04-04 11:23:11

查看http://dev.w3.org/SVG/profiles/1.1F2/test/svg/paths-dom-02-f.svg举例。 – 2010-04-06 09:20:44

这真的很酷。 – 2013-06-18 16:33:50

[0]对获取pathSegList属性至关重要。 – shaosh 2015-01-28 18:04:02

大部分pathSegList方法都需要检索/操作的段的索引，因此可能会出现序列化表示更好的场景。取0个单位的相对移动（例如'm 0,0'）作为替代钩子。因为你有相对绘图的不同pathh命令，你甚至可以用上下文来为你的钩子赋值。请注意，如果您考虑像'm 0，m 0， - '这样的模式，nops的数量是无限的 - 您的里程可能会根据您的svg生成器的质量而有所不同。

请注意，js replace方法在正则表达式上运行，因此您不需要替换挂钩就可以添加或预先添加路径段。

最好的问候，卡斯滕

PS：我知道马蒂斯答案已经存在了很长一段时间......

来源

2011-03-23 08:23:55 collapsar

这是其中一条线的终点正在使用jQuery移动为例SVG：

$('#svgdiv').svg();       //svgdiv - the id of the html element that contains your svg canvas. 
var svg = $('#svgdiv').svg('get'); 
var linePath = $($('#linePath'), svg.root()); //linePath - the id of the path element whose end point coordinates I want to change. 
var segments = linePath[0].pathSegList; 
for (var i=0; i < segments.numberOfItems; i++){ 
    var segment = segments.getItem(i); 
    switch(segment.pathSegType){ 
    case SVGPathSeg.PATHSEG_LINETO_ABS: 
    segment.x = x; 
    segment.y = y; 
    //other cases.. 
    } 
}

如果在相同的路径多条线段并希望改变特定段，则需要

通过将pathSegList段索引存储在变量中来跟踪该行。
或者如果您的用户输入是鼠标点击，请使用鼠标单击坐标来查找该段。

This关于SVGPathElement的好贴子。 This是SVG DOM文档。

来源

2011-08-21 07:14:51 rolnn

评论在SVG路径

回答

相关问题