Search code examples
dojox.chartingdojo

Dojo charting: How to add labels from datastore to my Axis?


I am still a newbie in dojo and javascript so this may be trivial.
I have created a "dojox.charting.Chart2D"-chart.
I get the data from a datastore (ItemFileReadStore) and can successfully display them in my DataSeries. I can also create my x a y Axis but the only contain simple numbers. What i need is to add to my x-Axis the text values from one field in my store. I found that this could be done with "labelFunc: function (n) {}" but i simply can't get it to read the data from my store.

My store data looks like this:

{ identifier: "UniqueId"  , items: [
{"UniqueId":1, "VisitDate":"2012-02-21T00:00:00", "VisitsTotal":407, "Visits10":71, "Visits15":6},
{"UniqueId":2, "VisitDate":"2012-02-20T00:00:00", "VisitsTotal":508, "Visits10":80, "Visits15":10},
...  

My code is like this:

var store = new dojo.data.ItemFileReadStore({ url: './../Data/MyJSONData.aspx' });
chart1 = new dojox.charting.Chart2D("simplechart1");  
chart1.addAxis("x", {fixUpper: "major",fixLower: "minor",title: 'Datum',
labelFunc: function (n) {
// HOW DO I GET THE VALUES 'VisitDate' FROM MY STORE ???
}});

chart1.addSeries('VisitsTotal',
new dojox.charting.DataSeries(store, { query: { Visits10: "*"} }, "Visits10"),
{ stroke: 'red', fill: 'pink' }
);

chart1.addSeries('Visits10',
new dojox.charting.DataSeries(store, { query: { Visits10: "*"} }, "Visits10"),
{ stroke: 'red', fill: 'pink' }
);
...

I already tried any combination but i really am missing some basics, on how to read from the store and also how to set my own text values (labels) to my X-Axis.

Thank you in advance.


Solution

  • Add (labels) to X-Axis.

    chart1.addAxis("x", { labels: [{value: 1, text: "Jan"}, {value: 2, text: "Feb"},
                             {value: 3, text: "Mar"}, {value: 4, text: "Apr"},
                             {value: 5, text: "May"}, {value: 6, text: "Jun"},
                             {value: 7, text: "Jul"}]
        });
    

    Or see in My jsfiddle.

    Read data from the store

    store.fetch( { query: {},  
                   onItem: function(item) {
                      console.log(store.getValue( item, 'VisitDate' ) );
                   }
    });
    

    See more at Dojo Livedoc or stackoverflow