Я не знаю, использует ли кто-нибудь это на самом деле, но я хочу использовать объект DOMMatrix для позиционирования и SCALE SVG-путь в HTMLCanvas 2d-контексте.
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.
До шкалы
![Before scale](https://i.stack.imgur.com/C391E.png)
После шкалы
![enter image description here](https://i.stack.imgur.com/mf2RK.png)
Кто-нибудь получил исправление? (Браузер: 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);