CSS变换矩阵图像不保留相同的位置

请原谅我，如果我没有把它清楚，但是我会尽我的水平最好把事情清楚CSS变换矩阵图像不保留相同的位置

我想翻转图像，因为它是Web应用程序我选择的CSS变换矩阵来执行这个翻转和尝试下面的代码片段和它的工作，但在定位有问题

svgCanvas.changeSelectedAttribute("transform","matrix(-1, 0, 0, 1, 0, 0)"); // Consider svgCanvas as element

翻转之前

翻转

这样做之后，你在图片中看到的不持有相同的位置。我做对了吗？

更新问题

在如你所说，但它从下一个翻转不同，因为它工作的第翻转。我已经为所有翻转应用了相同的MX = Left + Width/2。

第一倒装

后经过第二倒装

来源

2016-09-08 overflow

你的变换矩阵是用于镜像大约垂直线X = 0，所以坐标成为负的。

我想你需要镜像约中线MX = Left + Width/2形象，让你的矩阵应该像matrix(-1, 0, 0, 1, 2 * MX, 0)

2016-09-08 05:58:06 MBo

我可以知道左意思？ – overflow

左边是画布左侧边缘的初始位置（可能为零）。而“宽度”是图片宽度 – MBo

它在第一次翻动时起作用，当我尝试翻转时无法保持其在其他地方的位置 – overflow

回答