Кто-нибудь знает, как генерировать 4 цвета с новой яркостью на основе цвета в JavaScript?

Question

Привет, мне было интересно, знает ли кто-нибудь способ генерации однотонных цветов на основе одного цвета, введенного в шестнадцатеричном виде в функцию javascript.

Answer 1

Если вы хотите преобразовать цвет в некоторый уровень серой шкалы, попробуйте рассчитать свечение, например, так:

function toGrayScale(color) /* color is an integer */ {

    // Extract the red, green, and blue portions of the color
    var red = (color >> 16) & 0xff;
    var green = (color >> 8) & 0xff;
    var blue = color & 0xff;

    // Calculate the luminescence
    var luminescence = red * 0.3 + green * 0.59 + blue * 0.11;
    var lumInt = Math.floor(luminescence);

    // Combine into a grayscale color
    return (lumInt << 16) + (lumInt << 8) + lumInt;
}

Answer 2

То, что вы хотите сделать, это вычислить относительное значение для каждого цветового компонента по отношению к средней люминесценции, а затем умножить каждое из них на пару смещений, чтобы получить различную яркость ...

Это псевдокод, я уверен, что вы можете выяснить детали:

function getColors(baseline) {
  var offsets = [ 0x33, 0x66, 0x99, 0xCC ];

  // Use Jake's suggestion on computing luminescence...
  var lum = getLuminescence(baseline);

  var redCoefficient = baseline[red] / lum;
  var greenCoefficient = baseline[green] / lum;
  var blueCoefficient = baseline[blue] / lum;

  var output = [];
  for (offsetInd in offsets) {
     var offset = offsets[offsetInd];
     output.push(new Color(offset * redCoefficient, 
         offset * greenCofficient, offset * blueCoefficient));
  }

  return ouptut;
}

Answer 3

Попробуйте:

// color looks like 0xRRGGBB
function(color){
    R = color.substr(2, 2)
    G = color.substr(4, 2)
    B = color.substr(6, 2)
    return "0x" + R + R + R
    // or return ["0x"+R+R+R, "0x"+G+G+G, "0x"+B+B+B]
}

Кстати: «однотонный цвет» - оксюморон, не так ли? ; -)