.colors in barChart dc.js with two options

I want to create a color function that shows red when the value is negative and green in barChart.

Here is what I came up with so far:

var colorChoice = d3.scale.ordinal().domain(["positive","negative"])
                                    .range(["#00FF00","#FF0000"]);
hitsPerDaybarChart
.colors(function(d) {return(colorChoice((d.hits>0) ? "positive":"negative"));})

But I get the following error message: TypeError: Object function (d) {return(colorChoice((d.pnl>0) ? "positive":"negative"));} has no method 'range'.

All help is appreciated. Thank.

+3
source share
1 answer

You want to use the color access function.

1) Define your color range and domain:

.colors(d3.scale.ordinal().domain(["positive","negative"])
                                .range(["#00FF00","#FF0000"]))

2) Define your color accessory:

            .colorAccessor(function(d) { 
            if(d.value >0) 
                return "positive"
            return "negative";})

Hope this JSFiddle helps: http://jsfiddle.net/djmartin_umich/9ELWV/

+8
source

All Articles