错误：<g> 属性转换：应为 &#39;(&#39;

Question

希望有人知道该怎么做并且可以帮助我：

一个函数这样做：

element.setAttributeNS(null, 'transform', s);
if ('transform' in element.style) {
  element.style.transform = s;
} else if ('-ms-transform' in element.style) {
  element.style['-ms-transform'] = s;
} else if ('-webkit-transform' in element.style) {
  element.style['-webkit-transform'] = s;
}

其中“s”是这样的： s = 'matrix(' + matrix.a + ',' + matrix.b + ',' + matrix.c + ',' + matrix.d + ',' + matrix.e + ',' + matrix.f + ')'

它与此完美配合。 对于硬件加速，我想将+ ' translateZ(0)'到“s”。

执行此操作后，我收到以下错误：

错误：< g> 属性转换：应为 '(', "…39394) translateZ(0)"。

我也试过没有“+”直接连接。 也许有人知道我做错了什么。

更新

我将“s”更改为： s = 'matrix3d(' + matrix.a + ',' + matrix.b + ',' + 0 + ',' + 0 + ',' + matrix.c + ',' + matrix.d + ',' + 0 + ',' + 0 + ',' + 0 + ',' + 0 + ',' + 1 + ',' + 0 + ',' + matrix.e + ',' + matrix.f + ',' + 0 + ',' + 1 + ')'; 因为一个同事的想法。

不幸的是同样的错误：

错误：<g> 属性转换：应为 '(', "matrix3d(2.03961675842...".

Answer 1

错误来自您设置属性的第一行。 SVG 元素上的transform属性与 CSS 中的transform样式有点不同， 它们不支持translateZ 。 style.transform之后的所有内容style.transform应该没问题。

Answer 2

所以我知道我的问题是什么。 除了matrix()或matrix3d()之外，不可能使用任何东西

Answer 3

当我不小心输入时，我遇到了完全相同的错误

.attr("transform", `matrix3d(${this.transformToArray(matrix)})`)

而不是

.style("transform", `matrix3d(${this.transformToArray(matrix)})`)

在 D3。 请注意，该错误与转换无关，而是与 D3 函数有关。 只是为了帮助使用 D3 的人找到这篇文章:)