Declarative 2D columns type dojo chart (custom axis label)

Question

I'm new to dojo charting. I'm using dojo version 1.6.

I need to create 2D chart with custom x axis labels.

For that I have written below code

<div dojoType="dojox.charting.widget.Chart2D" id="chart1" style="width: 300px; height: 300px;"
     theme="dojox.charting.themes.MiamiNice">
        <div class="axis" name="x" font="italic normal normal 8pt Tahoma" fixUpper="major" > <!-- --> </div>
        <div class="axis" name="y" vertical="true" fixUpper="major" includeZero="true" font="italic normal normal 8pt Tahoma"><!-- --></div>
        <div class="plot" name="default" type="Columns" markers="true" gap="4"><!-- --></div>
        <div class="action" type="Tooltip"><!-- --></div>
        <div class="series" name="Run A" data="10, 20, 30, 40, 50, 60, 70"><!-- --></div>
        <div class="action" type="Highlight"><!-- --></div>
        <div class="action" type="Shake" shiftX="1" shiftY="1"><!-- --></div>
</div>

which is working very fine.

Now issue is I don't know how to give customise axis labels in declarative way. I searched on net regarding this, but no luck.

Please help!

Answer 1

You'll need to create the labels somewhere in javascript like this:

labels = [
    {value: 1, text: "One"},
    {value: 2, text: "Two"},
    {value: 3, text: "Three"}
]

then change your axis line to this:

<div class="axis" name="x" font="italic normal normal 8pt Tahoma" fixUpper="major" labels="labels"> <!-- --> </div>

To be able to listen to chart events, you can do something like this:

chart.connectToPlot("default", function(evt) {
  var type  = evt.type; 
  if(type=="onclick") {
    //Do something here
  }
});