javascript - CSS指数数

Question

我的 javascript 代码使用 double ，当我将数组转换为字符串时，我得到以下结果:transform: matrix3d(1, 0, 0, 0, 0, -1, 1.2246468525851679e-16, 0 , 0, -1.2246468525851679e-16, -1, 0, 0, -1.224646841997256e-14, -100, 1);

这在 css 中不起作用，因为 1.224646841997256e-14 在 CSS 中无效。

var toStr = function (a) {
    return  'matrix3d(' + a[0] + ', ' + a[1] + ', ' + a[2] + ', ' + a[3] + ', ' +
            a[4] + ', ' + a[5] + ', ' + a[6] + ', ' + a[7] + ', ' +
            a[8] + ', ' + a[9] + ', ' + a[10] + ', ' + a[11] + ', ' + 
            a[12] + ', ' + a[13] + ', ' + a[14] + ', ' + a[15] + ')';
};

我该如何解决？Number.toFixed 有效，但我必须给出一个数字，而且字符串非常大。例如 (1.0).toFixed(16)==1.0000000000000000

Answer 1

您需要做的是预处理您的 a 数组以生成有效的 CSS 值数字(没有指数表示法)。

限制是由于 matrix3d 中使用的参数的 CSS 规范函数，参见:

https://developer.mozilla.org/en-US/docs/Web/CSS/number

你在 .toFixed() 函数的正确轨道上，请参阅:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed

在您的情况下，如果您需要简单的整数或小数点后几位(具体取决于应用程序)，请将数字固定为 0 长度。

请注意，对于所有实际用途，1.2246468525851679e-16 等数字本质上都是 0.0。您不需要 16 位小数的精度。

我认为语法可能很简单(4 位小数):

(a[6]).toFixed(4);

但先尝试一下。