`
renyuan_1991
  • 浏览: 69507 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

获取渐变的颜色

阅读更多
function getConversionedColor(StartColor, endColor, conversionProportion){
    startRGB = colorRgb(formateColor(StartColor));
    startR = startRGB[0];
    startG = startRGB[1];
    startB = startRGB[2];

    endRGB = colorRgb(formateColor(endColor));
    endR = endRGB[0];
    endG = endRGB[1];
    endB = endRGB[2];

    conversionProportion = formateConversionProportion(conversionProportion);
    sR = startR + ((endR-startR) * conversionProportion);//总差值
    sG = startG + ((endG-startG) * conversionProportion);
    sB = startB + ((endB-startB) * conversionProportion);

    return colorHex('rgb('+parseInt((sR))+','+parseInt((sG))+','+parseInt((sB))+')');;
}

function formateConversionProportion(conversionProportion) {
    let result = Number(conversionProportion);
    if(result.isNaN || result < 0 ){
        result = 0;
    }else if(result > 1){
        result = 1;
    }
    return result;
}

function formateColor(color){
    let myColor = String(color).replace("#", "");
    if(isEmptyString(myColor) || myColor.length < 6 || myColor.length > 8){
        myColor = "ffffff"
    } else {
        myColor = myColor.substring(myColor.length - 6, myColor.length);
    }
    return "#" + myColor;
}

// 将hex表示方式转换为rgb表示方式(这里返回rgb数组模式)
function colorRgb(sColor){
    let reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
    let myColor = sColor.toLowerCase();
    if(myColor && reg.test(myColor)){
        if(myColor.length === 4){
            var sColorNew = "#";
            for(var i=1; i<4; i+=1){
                sColorNew += myColor.slice(i,i+1).concat(myColor.slice(i,i+1));
            }
            myColor = sColorNew;
        }
        //处理六位的颜色值
        let sColorChange = [];
        for(var i=1; i<7; i+=2){
            sColorChange.push(parseInt("0x"+myColor.slice(i,i+2)));
        }
        return sColorChange;
    }else{
        return myColor;
    }
}

// 将rgb表示方式转换为hex表示方式
function colorHex(rgb){
    let myRgb = rgb;
    let reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
    if(/^(rgb|RGB)/.test(myRgb)){
        let aColor = myRgb.replace(/(?:(|)|rgb|RGB)*/g,"").split(",");
        let strHex = "#";
        for(let i=0; i<aColor.length; i++){
            let hex = Number(aColor[i]).toString(16);
            hex = hex<10 ? 0+''+hex :hex;// 保证每个rgb的值为2位
            if(hex === "0"){
                hex += hex;
            }
            strHex += hex;
        }
        if(strHex.length !== 7){
            strHex = myRgb;
        }
        return strHex;
    }else if(reg.test(myRgb)){
        let aNum = myRgb.replace(/#/,"").split("");
        if(aNum.length === 6){
            return myRgb;
        }else if(aNum.length === 3){
            let numHex = "#";
            for(let i=0; i<aNum.length; i+=1){
                numHex += (aNum[i]+aNum[i]);
            }
            return numHex;
        }
    }else{
        return myRgb;
    }
}
0
0
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics