Ratkaistu: javascript hex to rgb

Suurin ongelma heksadesimaaliväriarvojen muuntamisessa RGB:ksi on se, että näiden kahden muodon välillä ei ole yksi-yhteen vastaavuutta. Esimerkiksi väri #FF0000 esitetään RGB:ssä muodossa 255, 0, 0, mutta heksadesimaalimuodossa se olisi yhtä suuri kuin väri #F0. Tämä tarkoittaa, että kahdella eri värillä voi olla sama RGB-arvo, jos ne koostuvat eri määristä kutakin värikomponenttia.

"use strict";

function hexToRgb(hex) {
    var result = /^#?([a-fd]{2})([a-fd]{2})([a-fd]{2})$/i.exec(hex);
    return result ? {
        r: parseInt(result[1], 16),
        g: parseInt(result[2], 16),
        b: parseInt(result[3], 16)
    } : null;
}

"käytä tiukkaa";

Tämä koodirivi mahdollistaa tiukan tilan, joka on tapa kirjoittaa parempi JavaScript. Tiukassa tilassa et voi käyttää ilmoittamattomia muuttujia. Tämän koodirivin on oltava JavaScript-tiedostosi yläosassa, jotta tiukka tila toimii.

function hexToRgb(hex) {
var tulos = /^#?([a-fd]{2})([a-fd]{2})([a-fd]{2})$/i.exec(hex);
palauttaa tuloksen? {
r: parseInt(tulos[1], 16),
g: parseInt(tulos[2], 16),
b: parseInt(tulos[3], 16)
} : tyhjä;
}

Tämä on toiminto, joka muuntaa hex-väriarvon RGB-väriarvoksi. Funktio ottaa yhden parametrin, joka on heksadesimaaliväriarvo, jonka haluat muuntaa. Funktio käyttää säännöllistä lauseketta vastaamaan hex-väriarvon kuviota, ja jos se löytää vastaavuuden, se palauttaa objektin punaisella, vihreällä ja sinisellä arvolla. Jos se ei löydä vastaavuutta, se palauttaa null.

Muunnos värien välillä

Tähän kysymykseen ei ole yksiselitteistä vastausta, sillä paras tapa muuntaa värejä eri väriavaruuksien välillä voi vaihdella sovelluksesi erityistarpeiden mukaan. Alla on kuitenkin vinkkejä värien muuntamiseen väriavaruuksien välillä JavaScriptissä.

Voit muuntaa värin yhdestä väriavaruudesta toiseen käyttämällä rgb()- ja hsl()-funktioita. Näillä funktioilla on kolme argumenttia: punainen, vihreä ja sininen arvo, vastaavasti. Ensimmäinen argumentti määrittää perusväravaruuden (esim. RGB), kun taas toinen ja kolmas argumentti määrittävät kohdeväriavaruuden (esim. HSL).

Voit muuntaa värin pikselimuodosta toiseen käyttämällä css()-funktiota. Tämä funktio ottaa kaksi argumenttia: merkkijono, joka edustaa CSS-ominaisuuden nimeä (esim. "väri") ja numero, joka edustaa tämän ominaisuuden haluttua arvoa (esim. "50").

Värimuodot

Voit käyttää JavaScriptissä muutamia eri värimuotoja.

RGB – punainen, vihreä, sininen

HEX – #RRGBB

HSL – Sävy, kylläisyys, vaaleus