d3 | object literal as data

was just making some tools and wanted to pass in an object (instead of an array) to render out it’s details using enter update loop; thought it may be useful to make a sketch, the transformation of this data (the object literal):

const data = {
    'key_1': 10,
    'key_2': 20,
    'key_3': 30,
    'key_4': 40,
    'key_5': 50,
}

if we create a nested array of the keys and map them with the values:

const newData = d3.keys(data).map(d => [d, data[d]])

we get this back (which we can now pass into our data():

[
  ["key_1",10],
  ["key_2",20],
  ["key_3",30],
  ["key_4",40],
  ["key_5",50]
]