一般用于生成地圖上點顏色的。

?

示例：

const cm=new ColorRangeMaker({color:[[80,163,186],[234,199,54],[217,78,93]],value:[0,200]}); const color=cm.make(100);console.log(color);

源碼

class ColorRangeMaker{option={};constructor(option){ let vRange=option.value[1]-option.value[0];if(option.color.length==2){//僅有兩個顏色let rA=(option.color[1][0]-option.color[0][0])/vRange;let gA=(option.color[1][1]-option.color[0][1])/vRange;let bA=(option.color[1][2]-option.color[0][2])/vRange;this.option={vRange,rA,gA,bA,option};}else{//兩個以上顏色const makers=[];let vA=vRange/(option.color.length-1);for(let i=1;i<option.color.length;i++){const maker=new ColorRangeMaker({color:[option.color[i-1],option.color[i]],value:[option.value[0]+vA*(i-1),option.value[0]+vA*i]});makers.push(maker);}this.option={makers,vA,option};}}make(value){const {makers,vRange,rA,gA,bA,vA,option}=this.option;if(value<option.value[0]){return option.color[0];}else if(value>option.value[option.value.length-1]){return option.color[option.color.length-1];}else{if(option.color.length==2){//僅有兩個顏色let color=option.color[0].map(a=>a);let vATmp=value-option.value[0];color[0]+=parseInt(rA*vATmp);color[1]+=parseInt(gA*vATmp);color[2]+=parseInt(bA*vATmp);return color;}else{for(let i=1;i<option.color.length;i++){if(value<=option.value[0]+vA*i){return makers[i-1].make(value);}}}}} } export default ColorRangeMaker;

?

總結

以上是生活随笔為你收集整理的js react根据几个颜色点计算区间任意数值对应颜色的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。