Advanced Search

Color Interpolation

/ Published in: JavaScript
Save to your folder(s)
Use case : interpolateColor("00EEDD","3ADECE",2,1) : interpolate the color level 1 between #00EEDD et #3ADECE on a 3 level scales (from 0 to 2).

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. function interpolateColor(minColor,maxColor,maxDepth,depth){
  2.  
  3.     function d2h(d) {return d.toString(16);}
  4.     function h2d(h) {return parseInt(h,16);}
  5.  
  6.     if(depth == 0){
  7.         return minColor;
  8.     }
  9.     if(depth == maxDepth){
  10.         return maxColor;
  11.     }
  12.  
  13.     var color = "#";
  14.  
  15.     for(var i=1; i <= 6; i+=2){
  16.         var minVal = new Number(h2d(minColor.substr(i,2)));
  17.         var maxVal = new Number(h2d(maxColor.substr(i,2)));
  18.         var nVal = minVal + (maxVal-minVal) * (depth/maxDepth);
  19.         var val = d2h(Math.floor(nVal));
  20.         while(val.length < 2){
  21.             val = "0"+val;
  22.         }
  23.         color += val;
  24.     }
  25.     return color;
  26. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.