Im trying to build a somewhat advanced "Flot" jQuery pluging graph. For that, I need a multidimensional object (or at least I think it is).
The structure should look like this:
var datasets = {
"usa": {
label: "USA",
data: [[1988, 483994], [1989, 479060], [1990, 457648], [1991, 401949], [1992, 424705], [1993, 402375], [1994, 377867], [1995, 357382], [1996, 337946], [1997, 336185], [1998, 328611], [1999, 329421], [2000, 342172], [2001, 344932], [2002, 387303], [2003, 440813], [2004, 480451], [2005, 504638], [2006, 528692]]
},
"russia": {
label: "Russia",
data: [[1988, 218000], [1989, 203000], [1990, 171000], [1992, 42500], [1993, 37600], [1994, 36600], [1995, 21700], [1996, 19200], [1997, 21300], [1998, 13600], [1999, 14000], [2000, 19100], [2001, 21300], [2002, 23600], [2003, 25100], [2004, 26100], [2005, 31100], [2006, 34700]]
}
};
From my code-behind i've generated some lists looking like this (Not the same data, but dont mind that):
<ul id="MOBILISATION">
<li data-key="2012/3/27">02:10</li>
<li data-key="2012/3/28">05:25</li>
<li data-key="2012/3/29">09:21</li>
<li data-key="2012/3/30">00:00</li>
<li data-key="2012/3/31">00:00</li>
</ul>
<ul id="OPERATIONS">
<li data-key="2012/3/27">19:51</li>
<li data-key="2012/3/28">18:35</li>
<li data-key="2012/3/29">14:39</li>
<li data-key="2012/3/30">07:46</li>
<li data-key="2012/3/31">10:26</li>
</ul>
Where "USA/usa" is "MOBILISATION", "1988" is "2012/3/27" and "483994" is "02:10". You get picture!!??
I've tried writing some jQuery, but it obviously doesnt work:
var objects = [];
var array = [];
var categoryName = "";
$('div#Container ul').each(function () {
catName = $(this).attr('id');
$('li', this).each(function () {
array.push([new Date($(this).data('key')).getTime(), $(this).text()]);
});
objects.push({ categoryName: { label: categoryName, data: array} });
});
var datasets = objects;
As you can see i've used push to objects array. Clearly that is not giving me the result I want. Im kindda loosing whats up and down in this, as its the first time I'm working with jQuery objects.
Whats the best solution for this?
Your datasets is an object, not an array - you can't push to it. Also, your variable categoryName does not work like that (read more on dot and bracket notation). Try this:
var datasets = {};
$('div#Container ul').each(function () {
catName = this.id;
var array = [];
$('li', this).each(function () {
array.push([
new Date($(this).data('key')).getTime(),
$(this).text()
]);
});
datasets[catName.toLowercase()] = {
label: catName.toUppercase(),
data: array
};
});
Also, I'm not sure whether you really would need to create Date objects, but that depends on your in- and output format.