Problème étrange avec un extrait pour générer des dégradés

Question

J'utilise ma propre bibliothèque pour beaucoup de choses, et récemment j'ai décidé d'ajouter une fonctionnalité de dégradé, mais j'ai rencontré un problème dont je me souviens avoir eu un peu de temps il y a aussi, et c'est l'affaire de mon gradient étant légèrement fermé près de la fin. Tout d'abord, le code en question:

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; 
}; 

Et, bien sûr, ma bibliothèque: http://wimg.co.uk/HJ0X8B.js

Amusez-vous là-dedans! Si vous pensez que vous pourriez être en mesure d'aider de quelque façon que ce soit, les fonctions personnalisées que j'utilise dans l'extrait de dégradé sont _replace(), chunk(), map() et toBase() et fromBase() ... Comme vous pouvez le voir au this demo page, tout fonctionne à peu près (au moins dans Opera et Firefox), sauf que le dégradé est toujours aussi léger à la fin (survolez pour afficher la valeur hexadécimale). Par exemple, appeler gradient(50, ['ffffff', 'ffff00', '00ff00']) crée en effet un tableau de longueur 50 qui contient des valeurs de couleurs hexadécimales passant progressivement du rouge au jaune puis au chaux, mais la dernière couleur n'est pas exactement du chaux (dans ce cas, il sort 05ff00); Cela signifie qu'il y a quelque chose de légèrement différent dans les mathématiques et non dans la méthodologie.

Alors ... quelqu'un qui veut patauger dans la jungle c'est le code que je trouve si étrangement beau pour m'aider à trouver une solution? Toute aide est grandement appréciée.

Answer 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][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; 
}; 

utilisation (l-1) au lieu de l sur la dernière ligne de calcul depuis que vous avez préparé la matrice de s pour l-1 étapes non l.

BTW votre code est vraiment difficile à comprendre, essayez d'écrire plus compréhensible et code standart. Et écrivez pour les boucles au lieu de [0, 1, 2] .map (sth).