Fill colour for individual bars in Dojo Chart?

Question

This is likely fairly simple Q (learning the ropes with Dojo).

I have successfully created a bar chart in my web app.

// Create Chart
var chartDiv = dojo.create("div");
dijit.byId("someDiv").setContent(chartDiv);
var chart1 = dojox.charting.Chart2D(chartDiv);

chart1.addPlot("default", {
    type: "Bars",
    gap: 3
});
chart1.addAxis("x");
chart1.addAxis("y", {
    vertical: true,
    labels: [{
        value: 1,
        text: "Field1"
    }, {
        value: 2,
        text: "Field2"
    }]
});
chart1.addSeries("MyData", [var1, var2]);
chart1.render();

I see that you can create custom themes to your charts. However, I am thinking there must be a simpler way to define a colour (ideally a subtle gradient) for each of my bars. I am also restricted to using a dojo version served up by Esri, and not sure if that allows me to then create cutom themes.

There will only ever be 5 bars (2 in the above snippet).

i.e. I want to define a different color for each bar.

Can someone put me out of my misery and provide some guidance on how to achieve this?

score 5 · Accepted Answer · answered Dec 11 '12 at 12:30

5

In hindsight, bit lazy on my side. Here is what worked for me:

chart1.addSeries("Languages", [
    { y: var1, fill: "#BD48E9" },
    { y: var2, fill: "#FA4848" },
]);

answered Dec 11 '12 at 12:30

jakc

1,161
3
15
42

score 3 · Answer 2 · answered Dec 10 '12 at 12:54

3

You add the following code before calling render method

chart1.addSeries("MyData", [var1, var2],
        {plot: "other", stroke: {color:"red"}, fill: "lightgreen"}
);
chart1.render();

answered Dec 10 '12 at 12:54

Earth

3,477
6
37
78

Will this define a color for each of my bars? It looks like it sets the fill for all the bars? – jakc Dec 10 '12 at 12:56

Fill colour for individual bars in Dojo Chart?

2 Answers2