我不知道是否有人真正使用过此功能,但是我想使用DOMMatrix对象在HTMLCanvas 2d上下文中定位和 SCALE SVG路径。
var path = new Path2D("M0.55,0.55 C0.55,0.55,0.45,0.55,0.45,0.55 C0.45,0.55,0.45,0.45,0.45,0.45 C0.45,0.45,0.55,0.45,0.55,0.45 C0.55,0.45,0.55,0.55,0.55,0.55");
var matrix = new DOMMatrix();
matrix.translateSelf(50,50);
matrix.scaleSelf(5); // <-- THIS IS THE PROBLEM!
//add matrix to SVG-Path
var draw = new Path2D();
draw.addPath(path, matrix);
ctx.strokeStyle = "lime";
ctx.stroke(draw);
现在,由于某种原因scaleSelf()破坏了矩阵。对象属性用NAN填充。
规模化之前
缩放后
有人修复了吗? (浏览器:Firefox Dev)
var matrix = new DOMMatrix();
matrix.translateSelf(50,50);
console.log("After translate: ", matrix);
matrix.scaleSelf(5); // <-- THIS IS THE PROBLEM!
console.log("After scale: ", matrix);