Oblicz kolor HEX mający 2 kolory i procent/pozycję

Question

Czy można obliczyć kolor w środku gradientu?

var color1 = 'FF0000'; 
var color2 = '00FF00'; 

// 50% between the two colors, should return '808000' 
var middle = gradient(color1, color2, 0.5); 

Mam tylko dwa ciągi heksadecymalne i chcę jeden w zamian.

Answer 1

To powinno działać:

To w zasadzie polega na przekształcaniu ich na dziesiętne, znalezienie połówki, konwersja wyników z powrotem do hex, a następnie ich łączenie.

var color1 = 'FF0000'; 
var color2 = '00FF00'; 
var ratio = 0.5; 
var hex = function(x) { 
    x = x.toString(16); 
    return (x.length == 1) ? '0' + x : x; 
}; 

var r = Math.ceil(parseInt(color1.substring(0,2), 16) * ratio + parseInt(color2.substring(0,2), 16) * (1-ratio)); 
var g = Math.ceil(parseInt(color1.substring(2,4), 16) * ratio + parseInt(color2.substring(2,4), 16) * (1-ratio)); 
var b = Math.ceil(parseInt(color1.substring(4,6), 16) * ratio + parseInt(color2.substring(4,6), 16) * (1-ratio)); 

var middle = hex(r) + hex(g) + hex(b); 

Answer 2

nie mogę wypowiedzieć się na temat odpowiedzi powyżej, więc piszę tutaj:

I okazało się, że w sposobie podciągu Javascript wskaźnik do parametru nie jest wliczone w zwrócony ciąg. Oznacza to, że:

var string = "test"; 
//index: 
alert(string.substring(1,3)); 

//will alert es and NOT est 

Edit: Tak powinno być:

parseInt(color1.substring(0,2), 16); 
parseInt(color1.substring(2,4), 16); 

i

parseInt(color1.substring(4,6), 16);