Example of calculating gradient color in javascript

This article mainly introduces the relevant information of javascript examples of calculating gradient colors. I hope that this article can help everyone learn JavaScript better, so that everyone can understand and master this part of the content and be interested in JavaScript. Friends can refer to this article

Instance of javascript calculating gradient color

Sometimes, a table or an area needs several Colors of the same color series from light to dark, as shown in the picture:

If less colors are needed, the color difference is larger, and more colors are needed. Then the color difference is small, as shown below:

At this time, the calculation of the gradient color of the same color system is used, the algorithm is as follows :

function getItemColors (colorLevel) { 
  var colors= []; 
  //默认的最深颜色 
  var red = 134,green = 108, blue = 184; 
  //最浅颜色是239,239,239 比如：最浅颜色的red是 239 则差值为239-134=105 
  var maxRed = 105,maxGreen = 131,maxBlue = 55; 
  var level = colorLevel; 
  while(level--) { 
    colors.push( 'rgb('+red +','+green+','+blue+')'); 
    red += parseInt(maxRed/colorLevel); 
    green += parseInt(maxGreen/colorLevel); 
    blue += parseInt(maxBlue/colorLevel); 
  } 
  return colors; 
}

The above is all the content of this article. I hope everyone is interested in this article! !

Related recommendations:

Javascript uses rem for responsive development example sharing

How to implement Javascript webpage red envelope grabbing plug-in

Javascript converts the absolute path of the image to base64 encoding

The above is the detailed content of Example of calculating gradient color in javascript. For more information, please follow other related articles on the PHP Chinese website!