Question

删除了chrome 48中的

： SVGPathElement.pathSegList

本页W3C编辑的草案2016年1月19日显示了访问段列表的新方法 https://svgwg.org/specs/paths/#InterfaceSVGPathData

但是，如何使用它？（在SVGPathElement中方法“getPathData”不存在）

Answer 1

为什么不使用SVGPathSeg polyfill？然后，您无需更改任何现有代码。

Answer 2

罗伯特·朗森的建议现在很好。您所指的API（ getPathData ， setPathData ）都是全新的，尚未实施。在实施和可用之前，可能还会有变化。

Answer 3

Chrome尚未实现新的getPathData和setPathData API 您应该使用path data polyfill：

https://github.com/jarek-foksa/path-data-polyfill.js

以下是代码示例：

//svg code:
//...
//<path d="M0,0 L100,50" id="mypath"></path>
//<script xlink:href="/js/path-data-polyfill.js"></script>
//...

//js code:
var path = document.getElementById('mypath');
var pathdata = path.getPathData();
console.log(pathdata);
console.log(pathdata.length); //2
console.log(pathdata[0].type); //"M"
console.log(pathdata[0].values); //[0,0]
console.log(pathdata[1].type); //"L"
console.log(pathdata[1].values); //[100,50]
pathdata.push({type: "C", values: [100,-50,200,150,200,50]}); //add path segment
path.setPathData(pathdata); //set new path data
console.log(path.getAttribute('d')); //"M0,0 L100,50 C100,-50,200,150,200,50"

Answer 4

回到

path.setAttribute('d', ...)

对于发现与SVG 1.1不兼容的浏览器。

此外，如果浏览器是以前支持SVG 1.1的品牌，则打印一条消息，建议用户升级回到旧版本（甚至可能考虑一个不同的，更稳定的浏览器品牌，可能是考虑到开发人员在缺乏曾经完美运行的功能时所需的时间而设计的，然后为了替换它们而被删除什么都没有，正如ktejik所指出的那样。）

SVGPathData chrome 48

4 个答案: