Json format issue in d3 pack layout

322 views Asked by At

I am very new to d3. I have 3 days old d3 knowledge. I was trying to make one pack layout but I am not able to call translate(of transform) function based on the data in external json file. My json file is not formatted as name, children order (which has been used most of the examples). So, can any one clarify that whether we must have the json file in proper format like in tree structure to get the proper pack or tree layout. My json file format is:

 {
   "sourcefile":"Script",
   "structure":{
      "Links":[
         [
            "step1",
            "port1",
            "step2",
            "port2"
         ],
         [
            "step3",
            "port3",
            "step4",
            "port4"
         ]
      ],
      "device":{
         "step1":{
            "args":{
               "pin":[
                  "XXXX",
                  100
               ]
            },
            "device_type":"console"
         },
         "lock":{
            "args":{
               "username":[
                  "XXXX",
                  "test"
               ],
               "address":[
                  "XXXX",
                  "10.0.0.1"
               ]
            },
            "device_type":"Light"
         }
      }
   }
}

It it's true..I was wondering if anyone can tell me about some online tool to format this json file into the following format..

        {
           "name": "Names",
           "children":
               [
                   { "name": "John", "size": 100 }
               ]
        }
1

There are 1 answers

0
Stephen Thomas On

Your intuition is correct. The pack layout requires input data formatted as a hierachy. It seems unlikely that an online tool to convert general JSON data to this structure would exist, as such a tool would almost have to be custom-built for each particular data set. However, d3 itself has utility functions to help you to create the required structure. I'm referring to the Nest utilities. Looking at your input data, it's not at all obvious how to structure it in a hierarchy, so I can't offer any specific implementations suggestions. In general, though, I'd suggest transforming your data into a simple array of objects and then use the d3.nest utilities to extract the hierarchy from the data.