Ignore case when detecting colors for interpolation.

Fixes d3#2359.

Author: jasondavies

d3.js

@@ -1699,8 +1699,9 @@
     return v < 16 ? "0" + Math.max(0, v).toString(16) : Math.min(255, v).toString(16);
   }
   function d3_rgb_parse(format, rgb, hsl) {
+    format = format.toLowerCase();
     var r = 0, g = 0, b = 0, m1, m2, color;
-    m1 = /([a-z]+)\((.*)\)/i.exec(format);
+    m1 = /([a-z]+)\((.*)\)/.exec(format);
     if (m1) {
       m2 = m1[2].split(",");
       switch (m1[1]) {
@@ -1715,7 +1716,7 @@
         }
       }
     }
-    if (color = d3_rgb_names.get(format.toLowerCase())) {
+    if (color = d3_rgb_names.get(format)) {
       return rgb(color.r, color.g, color.b);
     }
     if (format != null && format.charAt(0) === "#" && !isNaN(color = parseInt(format.slice(1), 16))) {
@@ -5785,7 +5786,7 @@
   }
   d3.interpolators = [ function(a, b) {
     var t = typeof b;
-    return (t === "string" ? d3_rgb_names.has(b) || /^(#|rgb\(|hsl\()/.test(b) ? d3_interpolateRgb : d3_interpolateString : b instanceof d3_color ? d3_interpolateRgb : Array.isArray(b) ? d3_interpolateArray : t === "object" && isNaN(b) ? d3_interpolateObject : d3_interpolateNumber)(a, b);
+    return (t === "string" ? d3_rgb_names.has(b.toLowerCase()) || /^(#|rgb\(|hsl\()/i.test(b) ? d3_interpolateRgb : d3_interpolateString : b instanceof d3_color ? d3_interpolateRgb : Array.isArray(b) ? d3_interpolateArray : t === "object" && isNaN(b) ? d3_interpolateObject : d3_interpolateNumber)(a, b);
   } ];
   d3.interpolateArray = d3_interpolateArray;
   function d3_interpolateArray(a, b) {

d3.min.js

@@ -56,6 +56,7 @@ function d3_rgb_hex(v) {
 }
 
 function d3_rgb_parse(format, rgb, hsl) {
+  format = format.toLowerCase();
   var r = 0, // red channel; int in [0, 255]
       g = 0, // green channel; int in [0, 255]
       b = 0, // blue channel; int in [0, 255]
@@ -64,7 +65,7 @@ function d3_rgb_parse(format, rgb, hsl) {
       color;
 
   /* Handle hsl, rgb. */
-  m1 = /([a-z]+)\((.*)\)/i.exec(format);
+  m1 = /([a-z]+)\((.*)\)/.exec(format);
   if (m1) {
     m2 = m1[2].split(",");
     switch (m1[1]) {
@@ -86,7 +87,7 @@ function d3_rgb_parse(format, rgb, hsl) {
   }
 
   /* Named colors. */
-  if (color = d3_rgb_names.get(format.toLowerCase())) {
+  if (color = d3_rgb_names.get(format)) {
     return rgb(color.r, color.g, color.b);
   }
 

src/color/rgb.js

@@ -17,7 +17,7 @@ function d3_interpolate(a, b) {
 d3.interpolators = [
   function(a, b) {
     var t = typeof b;
-    return (t === "string" ? (d3_rgb_names.has(b) || /^(#|rgb\(|hsl\()/.test(b) ? d3_interpolateRgb : d3_interpolateString)
+    return (t === "string" ? (d3_rgb_names.has(b.toLowerCase()) || /^(#|rgb\(|hsl\()/i.test(b) ? d3_interpolateRgb : d3_interpolateString)
         : b instanceof d3_color ? d3_interpolateRgb
         : Array.isArray(b) ? d3_interpolateArray
         : t === "object" && isNaN(b) ? d3_interpolateObject

src/interpolate/interpolate.js

@@ -26,12 +26,21 @@ suite.addBatch({
       "interpolates named colors in RGB": function(d3) {
         assert.strictEqual(d3.interpolate("red", "green")(.4), "#993300");
       },
+      "interpolates case-insensitive named colors in RGB": function(d3) {
+        assert.strictEqual(d3.interpolate("ReD", "GrEeN")(.4), "#993300");
+      },
       "interpolates decimal RGB colors in RGB": function(d3) {
         assert.strictEqual(d3.interpolate("rgb(255,0,0)", "rgb(0,128,0)")(.4), "#993300");
       },
+      "interpolates case-insensitive decimal RGB colors in RGB": function(d3) {
+        assert.strictEqual(d3.interpolate("RgB(255,0,0)", "rGb(0,128,0)")(.4), "#993300");
+      },
       "interpolates decimal HSL colors in RGB": function(d3) {
         assert.strictEqual(d3.interpolate("hsl(0,100%,50%)", "hsl(120,100%,25%)")(.4), "#993300");
       },
+      "interpolates case-insensitive decimal HSL colors in RGB": function(d3) {
+        assert.strictEqual(d3.interpolate("HsL(0,100%,50%)", "hSl(120,100%,25%)")(.4), "#993300");
+      },
       "coerces a to a color": function(d3) {
         assert.strictEqual(d3.interpolate({toString: function() { return "red"; }}, "green")(.4), "#993300");
       }