1

我使用自己的库来做很多东西，最近我决定添加渐变功能，但我遇到了一个我似乎记得不久前也遇到过的问题，这就是我的渐变稍微偏离了附近的问题结束。首先，有问题的代码：

gradient = function(l, g)
 {
var r = [], s = [], f = g.length - 1;
for (var x = 0; x < g.length; x++)
    g[x] = (typeof(g[x]) == 'string' ? g[x] : g[x].join(','))._replace(['#', ' ', 'rgb(', ')'], ''),
    g[x] = (g[x].indexOf(',') != -1
        ? g[x].split(',')
        : g[x].chunk(2).map(function(_)
         {
            return _.fromBase('hex');
         }));
for (var x = 0; x < f; x++)
    s[x] = [(g[x][0] - g[x + 1][0]) / (l - 1) * f, (g[x][1] - g[x + 1][2]) / (l - 1) * f, (g[x][2] - g[x + 1][2]) / (l - 1) * f];
for (var x = 0; x < l; x++)
    r[x] = '', ([0, 1, 2]).map(function(_)
     {
        var c = Math.floor(x / (l / (g.length - 1)));
        r[x] += (g[c][_] - s[c][_] * (x - (l / (g.length - 1)) * c)).toBase('hex').pad('0', 2);
     });
return r;
 };

当然，我的图书馆：http ://wimg.co.uk/HJ0X8B.js

在那里玩得开心！: ) 如果您认为您可能能够以任何方式提供帮助，我在渐变片段中使用的自定义函数是 _replace()、chunk()、map()、toBase() 和 fromBase()...正如您将能够在此演示页面中看到的那样，一切都非常有效（至少在 Opera 和 Firefox 中）除了渐变在最后稍微偏离（悬停以显示十六进制值）。例如，调用gradient(50, ['ffffff', 'ffff00', '00ff00'])确实创建了一个长度为 50 的数组，其中包含逐渐从红色变为黄色然后变为石灰的十六进制颜色值，但是最后一种颜色并不完全是石灰（在这种情况下，它是 05ff00）；这意味着在数学而不是方法论中有些许偏差。

所以...有人愿意在丛林中跋涉，我觉得代码非常漂亮，可以帮助我找到解决方案吗？非常感谢所有帮助。

4

1 回答 1

2 
gradient = function(l, g)
 {
var r = [], s = [], f = g.length - 1;
for (var x = 0; x < g.length; x++)
    g[x] = (typeof(g[x]) == 'string' ? g[x] : g[x].join(','))._replace(['#', ' ', 'rgb(', ')'], ''),
    g[x] = (g[x].indexOf(',') != -1
        ? g[x].split(',')
        : g[x].chunk(2).map(function(_)
         {
            return _.fromBase('hex');
         }));
for (var x = 0; x < f; x++)
    s[x] = [(g[x][0] - g[x + 1][0]) / (l - 1) * f, (g[x][1] - g[x + 1][1]) / (l - 1) * f, (g[x][2] - g[x + 1][2]) / (l - 1) * f];
for (var x = 0; x < l; x++)
    r[x] = '', ([0, 1, 2]).map(function(_)
     {
        var c = Math.floor(x / (l / (g.length - 1)));
        r[x] += (g[c][_] - s[c][_] * (x - ((l-1) / (g.length - 1)) * c)).toBase('hex').pad('0', 2);
     });
return r;
 };

在最后一个计算行上使用 (l-1) 而不是 l，因为您已经为 l-1 步而不是 l 准备了 s 数组。

顺便说一句，您的代码真的很难理解，请尝试编写更易于理解和标准的代码。并且写 for 循环而不是 [0, 1, 2].map(sth)。

于 2009-04-13T18:07:44.157 回答