How to create an SVG Matrix without an SVG element

问题:

I have been accessing the SVGMatrix prototype to use its power for matrix transformations. These transformations are not necessarily related to any SVG element

var svgElement = $('svg')[0];
var svgMatrix = svgElement.createSVGMatrix()
Object.create(svgMatrix.__proto__)

Essentially I want to be able to create a svgMatrix as in line two without first relying on a svg element in the DOM as in line 1.

回答1:

How about

var matrix = document.createElementNS("http://www.w3.org/2000/svg", "svg").createSVGMatrix();

回答2:

Just use new DOMMatrix(). It's the same thing.

Even though DOMMatrix !== SVGMatrix,

they share the same constructor DOMMatrix.constructor === SVGMatrix.constructor.

lib.dom.d.ts also equates the two:

type SVGMatrix = DOMMatrix;
declare var SVGMatrix: typeof DOMMatrix;