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?

Was it helpful?

Solution

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

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

OTHER TIPS

You add the following code before calling render method

chart1.addSeries("MyData", [var1, var2],
        {plot: "other", stroke: {color:"red"}, fill: "lightgreen"}
);
chart1.render();
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top