Issue #272 Bullet chart color method

nv.d3.js

@@ -980,6 +980,7 @@ nv.models.bullet = function() {
     , width = 380
     , height = 30
     , tickFormat = null
+    , color = nv.utils.getColor(['#1f77b4'])
     , dispatch = d3.dispatch('elementMouseover', 'elementMouseout')
     ;
 
@@ -1069,6 +1070,7 @@ nv.models.bullet = function() {
 
       measure.enter().append('rect')
           .attr('class', function(d, i) { return 'nv-measure nv-s' + i; })
+          .style('fill', function(d,i) { return color(d,i ) })
           .attr('width', w0)
           .attr('height', availableHeight / 3)
           .attr('x', reverse ? x0 : 0)
@@ -1199,6 +1201,12 @@ nv.models.bullet = function() {
     return chart;
   };
 
+  chart.color = function(_) {
+    if (!arguments.length) return color;
+    color = nv.utils.getColor(_);
+    return chart;
+  };
+
   //============================================================
 
 
@@ -1467,6 +1475,8 @@ nv.models.bulletChart = function() {
   chart.dispatch = dispatch;
   chart.bullet = bullet;
 
+  d3.rebind(chart, bullet, 'color');
+
   // left, right, top, bottom
   chart.orient = function(x) {
     if (!arguments.length) return orient;

src/models/bullet.js

@@ -19,6 +19,7 @@ nv.models.bullet = function() {
     , width = 380
     , height = 30
     , tickFormat = null
+    , color = nv.utils.getColor(['#1f77b4'])
     , dispatch = d3.dispatch('elementMouseover', 'elementMouseout')
     ;
 
@@ -108,6 +109,7 @@ nv.models.bullet = function() {
 
       measure.enter().append('rect')
           .attr('class', function(d, i) { return 'nv-measure nv-s' + i; })
+          .style('fill', function(d,i) { return color(d,i ) })
           .attr('width', w0)
           .attr('height', availableHeight / 3)
           .attr('x', reverse ? x0 : 0)
@@ -238,6 +240,12 @@ nv.models.bullet = function() {
     return chart;
   };
 
+  chart.color = function(_) {
+    if (!arguments.length) return color;
+    color = nv.utils.getColor(_);
+    return chart;
+  };
+
   //============================================================
 
 

src/models/bulletChart.js

@@ -259,6 +259,8 @@ nv.models.bulletChart = function() {
   chart.dispatch = dispatch;
   chart.bullet = bullet;
 
+  d3.rebind(chart, bullet, 'color');
+
   // left, right, top, bottom
   chart.orient = function(x) {
     if (!arguments.length) return orient;

src/nv.d3.css

@@ -495,8 +495,6 @@ svg .title {
 .nvd3.nv-bullet .nv-range.nv-s0 { fill: #eee; }
 .nvd3.nv-bullet .nv-range.nv-s1 { fill: #ddd; }
 .nvd3.nv-bullet .nv-range.nv-s2 { fill: #ccc; }
-.nvd3.nv-bullet .nv-measure.nv-s0 { fill: steelblue; }
-.nvd3.nv-bullet .nv-measure.nv-s1 { fill: darkblue; }
 .nvd3.nv-bullet .nv-title { font-size: 14px; font-weight: bold; }
 .nvd3.nv-bullet .nv-subtitle { fill: #999; }