parametri AddSeries
-
25-09-2019 - |
Domanda
Mi sforzo di ottenere alcuni grafici funzionali con dojo ...
Voglio creare un grafico ad area in pila con 3 linee. Per i "bas", "Moy" e "haut", come si vede nei dati JSON.
var jStore = {"identifier":"mois",
"items":[{"mois":1, "bas":98, "moy":122.5, "haut":147},
{"mois":2, "bas":91, "moy":113.75, "haut":136.5},
{"mois":3, "bas":91, "moy":113.75, "haut":136.5},
{"mois":4, "bas":84, "moy":105, "haut":126},
{"mois":5, "bas":77, "moy":96.25, "haut":115.5},
{"mois":6, "bas":63, "moy":78.75, "haut":94.5},
{"mois":7, "bas":49, "moy":61.25, "haut":73.5},
{"mois":8, "bas":42, "moy":52.5, "haut":63},
{"mois":9, "bas":49, "moy":61.25, "haut":73.5},
{"mois":10, "bas":70, "moy":87.5, "haut":105},
{"mois":11, "bas":77, "moy":96.25, "haut":115.5},
{"mois":12, "bas":84, "moy":105, "haut":126}]
};
Voglio mettere int all'asse x mesi come si vede nel codice. Chiamare i dati specifici in JSON per creare ogni linea.
dojo.addOnLoad(function() {
var chart1 = new dojox.charting.Chart2D('chart1');
chart1.addPlot('default', {
type: 'StackedAreas',
markers: true,
tension: 'S',
lines: true,
areas: true,
labelOffset: -30,
shadows: {
dx:2, dy:2, dw:2
}
});
chart1.addAxis('x', {max:12,
labels:[
{value: 0, text: ""},
{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"},
{value: 8, text: "Aug"},
{value: 9, text: "Sept"},
{value: 10, text: "Oct"},
{value: 11, text: "Nov"},
{value: 12, text: "Dec"}
]});
chart1.addAxis('y', { vertical: true, max:200, includeZero: true });
chart1.addSeries('Basse', (jStore, {query: {bas: "*"}}, "bas"),{ stroke: 'red', fill: 'pink' });
chart1.addSeries('Moyenne',(jStore, {query: {moy: "*"}}, "moy"), { stroke: 'green', fill: 'lightgreen' });
chart1.addSeries('Haute',(jStore, {query: {haut: "*"}}, "haut"), { stroke: 'blue', fill: 'lightblue' });
chart1.render();
var anim1a = new dojox.charting.action2d.Magnify(chart1, "default");
var anim1b = new dojox.charting.action2d.Tooltip(chart1, "default");
var legend1 = new dojox.charting.widget.Legend({
chart:chart1
},"legend1");
chart1.render();
});
Non funziona, non so Wath devo mettere al posto di (jStore, {query: {haut: "*"}}, "haut")
chiamare i miei dati specifici.
aiuto per favore! Grazie mille.
Soluzione
Dalla documentazione ufficiale Utilizzando dojo.data Fonti dei dati con i grafici :
dojox.charting.DataSeries viene utilizzato per connettersi a negozi dojo.data. L'utente deve creare e passarlo al posto di un array di dati in chart.addSeries () chiamata.
Esempio di utilizzo può essere trovato in dojox/charting/tests/test_DataSeries.html
.
Un altro pezzo mancante nel tuo esempio è un oggetto negozio. In qualche modo si tenta di passare una struttura JSON in giro, che ha i dati, ma non richiesto metodi. È necessario creare un archivio dati prima dai dati. Non ho idea di quali dati memorizzare che si desidera utilizzare, ma se tutto quello che volete è quello di mostrare la struttura dei dati, è possibile utilizzare dojo.data.ItemFileReadStore
:
dojo.require("dojo.data.ItemFileReadStore");
var jStore = ...; // not really a store, but your JSON-like object
var realStore = new dojo.data.ItemFileReadStore({data: jStore});
...
chart1.addSeries(
'Basse',
new dojox.charting.DataSeries(realStore, {query: {bas: "*"}}, "bas"),
{stroke: 'red', fill: 'pink'}
);
Usa link qui sopra per conoscere dojox.charting.DataSeries
. Leggi tutto dojo.data
riguardo nella documentazione ufficiale: http://docs.dojocampus.org/dojo/data