Create a multidimensional object with multidimensional arrays

Question

I am trying to create a somewhat advanced jQuery "Flot" graphical plugin. To do this, I need a multi-dimensional 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, I created several lists similar to this (not the same data, but not against):

 <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 "MOBILIZATION", "1988" is "2012/3/27", and "483994" is "02:10". Are you getting the picture !! ??

I tried writing jQuery, but it obviously does not 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 used push for the objects array. Clearly, this does not give me the result I want. Im kindda makes no sense of this since this is the first time I'm working with javascript / jQuery objects. What is the best solution for this?

Answer 1

Your data sets are an object, not an array - you cannot click on it. Also, your categoryName variable doesn't work like that (more on dot and bracket notation ). Try the following:

 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 if you really need to create Date objects, but it depends on your input and output format.

Answer 2

Change var objects = []; on var objects = {}; and change

 objects.push({ categoryName: { label: categoryName, data: array} }); 

to

 objects[categoryName] = { label: categoryName, data: array}; 

The problem with JSON objects is setting properties with a variable index. For this, Yuo can use the array notation as described above.

Answer 3

Try

  var data = {}; $('div#Container ul').each(function() { var sub_obj = data[$(this).attr('id').toLowerCase()] = { label: $(this).attr('id').toUpperCase(), data: [] }; $(this).children('li').each(function() { sub_obj.data.push([$(this).data('key'), $(this).text()]); }); }); console.log(data); 

Answer 4

Try the following:

 var datasets = {}; $('ul').each(function (i, v) { catName = $(this).attr('id'); datasets[catName] = { label : catName, data: [] }; $('li', this).each(function () { datasets[catName].data.push([new Date($(this).data('key')).getTime(), $(this).text()]); }) }); 

Demo: http://jsfiddle.net/nfsYu/6/

Answer 5

 function convertObject(obj, key) { let returnObje = {}; if (!key) key = ""; else key = key + "_"; Object.keys(obj).forEach(function (k1) { if (obj[k1] != null && typeof obj[k1] == "object") { returnObje = Object.assign({}, returnObje, convertObject(obj[k1], key + k1)) } else returnObje[key + k1] = obj[k1]; }); return returnObje; } var hotels = { "hilton": {"name": "hilton hotel" }, "newton": {"name": "newton hotel"} }; convertObject(hotels);