//颜色阶梯过渡(均匀渐变)Gradient算法 //Gradient = Start+ (End-Start) / Step * N function gradientColor(startColor, endColor, step) { if (startColor && endColor) { if (startColor[0] !== '#') { startColor = this.colorHex(startColor); } if (endColor[0] !== '#') { endColor = this.colorHex(endColor); } startRGB = this.colorRgb(startColor);//转换为rgb数组模式 startR = startRGB[0]; startG = startRGB[1]; startB = startRGB[2]; endRGB = this.colorRgb(endColor); endR = endRGB[0]; endG = endRGB[1]; endB = endRGB[2]; sR = (endR - startR) / step;//总差值 sG = (endG - startG) / step; sB = (endB - startB) / step; var colorArr = []; for (var i = 0; i < step; i++) { //计算每一步的hex值 var hex = this.colorHex('rgb(' + parseInt((sR * i + startR)) + ',' + parseInt((sG * i + startG)) + ',' + parseInt((sB * i + startB)) + ')'); colorArr.push(hex); } return colorArr; } return this; } // 将hex表示方式转换为rgb表示方式(这里返回rgb数组模式) gradientColor.prototype.colorRgb = function (sColor) { var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; var sColor = sColor.toLowerCase(); if (sColor && reg.test(sColor)) { if (sColor.length === 4) { var sColorNew = "#"; for (var i = 1; i < 4; i += 1) { sColorNew += sColor.slice(i, i + 1).concat(sColor.slice(i, i + 1)); } sColor = sColorNew; } //处理六位的颜色值 var sColorChange = []; for (var i = 1; i < 7; i += 2) { sColorChange.push(parseInt("0x" + sColor.slice(i, i + 2))); } return sColorChange; } else { return sColor; } }; // 将rgb表示方式转换为hex表示方式 gradientColor.prototype.colorHex = function (rgb) { var _this = rgb; var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; if (/^(rgb|RGB)/.test(_this)) { var str = _this.replace(/(rgb|RGB)*/g, ""); str = str.replace("(", "").replace(")", ""); var aColor = str.split(","); var strHex = "#"; for (var i = 0; i < aColor.length; i++) { var hex = Number(aColor[i]).toString(16); hex = hex.length === 1 ? 0 + '' + hex : hex;// 保证每个rgb的值为2位 if (hex === "0") { hex += hex; } strHex += hex; } if (strHex.length !== 7) { strHex = _this; } return strHex; } else if (reg.test(_this)) { var aNum = _this.replace(/#/, "").split(""); if (aNum.length === 6) { return _this; } else if (aNum.length === 3) { var numHex = "#"; for (var i = 0; i < aNum.length; i += 1) { numHex += (aNum[i] + aNum[i]); } return numHex; } } else { return _this; } };