Converting array of objects into array for Google Charts

Question

I have an array of objects:

    [
      {
      SalePrice:"18000",
      TotalValue:"22500"
      ratio:1.25
      }
      {
      SalePrice:"128000",
      TotalValue:"212500"
      ratio:1.05
      }
    ]

and I want to form it into an array. like:

[
        [18000,  22500, 1.25],
        [128000,  212500, 1.05]
]

Using JS (ES6 is ok). I have tried using somelike like:

let array = data.map(({SalePrice, TotalValue, ratio}) => SalePrice, TotalValue, ratio).filter(s => s, t = >t, r => r);

but that doesn't work could anyone enlighten me please?

"I have a JSON object array:" That does not look like JSON. Where did you copy that data from? — str, Oct 02 '18 at 11:21
Then you should read [What is the difference between JSON and Object Literal Notation?](https://stackoverflow.com/questions/2904131/what-is-the-difference-between-json-and-object-literal-notation) It will make your future questions more understandable. This question does not seem to be related to JSON at all. — str, Oct 02 '18 at 12:12

score 8 · Accepted Answer · answered Oct 02 '18 at 11:21

Maybe something like the following:

const data = [{SalePrice:"18000",TotalValue:"22500",ratio:1.25},{SalePrice: "128000",TotalValue:"212500",ratio:1.05}]
const mappedToArray = data.map(d => Array.from(Object.values(d)))
//[["18000", "22500", 1.25],["128000", "212500", 1.05]]

The advantage of this approach is not having to rely on hardcoded keys to access to properties in your object which the other answer does need. Which could also be a disadvantage in it's own if that includes properties Google Charts does not need.

score 2 · Answer 2 · answered Oct 02 '18 at 11:18

2

let objectArray = ...;
let container = [];

objectArray.forEach(e => container.push([e.SalePrice, e.TotalValue, e.ratio]));

answered Oct 02 '18 at 11:18

Adam

1,724
13
16

score 0 · Answer 3 · answered Oct 02 '18 at 11:26

Use array map:

var obj = [
    {
      SalePrice:"18000",
      TotalValue:"22500",
      ratio:1.25
    },
    {
      SalePrice:"128000",
      TotalValue:"212500",
      ratio:1.05
    }
  ];
var result = obj.map(current=>{
  return [Number(current.SalePrice), Number(current.TotalValue), current.ratio];
});
console.log(result);

score -1 · Answer 4 · answered Oct 02 '18 at 11:27

please check my code and refer for you:

script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-json/2.5.1/jquery.json.min.js"></script>
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        ${devicegroupusers}
        <c:url value="${UrlRequestMappingConstants.DASHBOARD_DEVICEGROUP_USERS}" var="formUrl"/>

          <script type="text/javascript">
              google.load("visualization", "1", {packages:["corechart"]});
              google.setOnLoadCallback(drawChart);
              function drawChart(devicegroupusers) {

                  var a = devicegroupusers, result = [];

                a = JSON.parse(a);

                for (var o = 0; o < a.length; o++) {
                    for (var p in a[o]) {
                        result.push([p, a[o][p]]);
                    }
                };

                console.log(result);

                  var data = google.visualization.arrayToDataTable(result);

                var options = {
                  title: 'My Daily Activities'
                };

                var chart = new google.visualization.BarChart(document.getElementById('piechart'));

                chart.draw(data, options);
              }
            </script>
          <div id="piechart" style="width: 900px; height: 500px;"></div>

devicegroupusers contains JSON like this

[{"name":"Default","count":2},{"name":"IT","count":1},{"name":"R\u0026D","count":1}]

How do I convert this to below example to draw a bar chart?

['name', 'count'], ['Default', 2], ['IT', 3], [R\u0026D', 1],

And To find answer i did:

var devicegroupusers = '[{"name":"Default","count":2},{"name":"IT","count":1},{"name":"R\u0026D","count":1}]', 
  result = [["name","count"]],
  devicegroupusers = JSON.parse(devicegroupusers);

$.each(devicegroupusers ,function(_,devicegroupuser) {
  result.push(
    [
      devicegroupuser["name"],devicegroupuser["count"]
    ]
  );
});
console.log(result);

where my jquery library is:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

please check my example and convert your JSON data for google chart datatable

Converting array of objects into array for Google Charts

4 Answers4