Colors for bar chart

[Archana Nanjundarao]

Hi,

I am trying to plot a bar chart which basically compares values from 3
fields. I want to set different colors for each bar. As of now its
picking the color from CSS.

Any help will be much appreciated.

Thanks,
Archana

[Scott Murray]

If you already have the rest of the bar chart drawing, then changing the color of each bar is pretty straightforward. For an example, see the "Color" section on this page:

http://alignedleft.com/tutorials/d3/making-a-bar-chart/

It sounds like you have three different colors in mind that correspond to three different data values or attributes. If you're drawing the bars as SVG rects, then in the code where you create the rects, just set the fill of each with attr() and a custom function, like:

.attr("fill", function(d) {
if (d == 0) {
return "red";
} else if (d == 1) {
return "red";
} else {
return "green";
}
});

I don't know what your data values are, but you could do something like this to assign colors to certain values.

Scott