In Chrome 48, PathSegList is removed. And as I read in the answers to another question "Alternative for deprecated SVG pathSegList", Chrome is providing a new API, but I guess this new API is not yet available. What is another alternative and how can I use it. I know this is duplicate, but the link I mentioned is not helping me.
You do not need path seg polyfill (pathSeg.js).
With path data polyfill, you can edit path data as a common array object.
Use path data polyfill to work with new API. It's recommended.
var path = document.querySelector('path'); //your <path> element
//Be sure you have added the pathdata polyfill to your page before use getPathData
var pathdata = path.getPathData();
console.log(pathdata);
/*
you will get an Array object contains all path data details
like this:
[
{ "type": "M", "values": [ 50, 50 ] },
{ "type": "L", "values": [ 200, 200 ] }
]
*/
//replacement for createSVGPathSegMovetoRel and appendItem
pathdata.push({type:'m', values:[200,100]});
path.setPathData(pathdata);
//replacement for createSVGPathSegMovetoAbs and appendItem
pathdata.push({type:'M', values:[300,120]});
path.setPathData(pathdata);
//replacement for createSVGPathSegLinetoAbs and appendItem
pathdata.push({type:'L', values:[400,120]});
path.setPathData(pathdata);
console.log(path.getAttribute('d'));
//create a new path data array
var pathdata = [
{ "type": "M", "values": [ 50, 50 ] },
{ "type": "L", "values": [ 200, 200 ] }
];
path.setPathData(pathdata);
console.log(path.getAttribute('d'));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With