How can i use DataInspector for showing data from JSON Array?

I have some additional JSON Data Array associated with every node.
So my node data is like this:
{ "key": 1, "Name": "Node 1", "color":"black", "location":"12.02 13.05", "OtherBackendData": [ { "Name": "Record1", "Id": 1 }, { "Name": "Record2", "Id": 2 }, { "Name": "Record3", "Id": 3 } ], "OtherFrontendData":[ { "Name": "FrontendRecord1", "Id": 1 }, { "Name": "FrontendRecord2", "Id": 2 }, { "Name": "FrontendRecord3", "Id": 3 } ] }v{ "key": 1, "Name": "Node 1", "color":"black", "location":"12.02 13.05", "OtherBackendData": [ { "Name": "Record1", "Id": 1 }, { "Name": "Record2", "Id": 2 }, { "Name": "Record3", "Id": 3 } ], "OtherFrontendData":[ { "Name": "FrontendRecord1", "Id": 1 }, { "Name": "FrontendRecord2", "Id": 2 }, { "Name": "FrontendRecord3", "Id": 3 } ] }

I want to display both array data along with other basic properties of key, name and location.

How can i do that ?

I suggest that you implement that in your own custom HTML. Whether that HTML is within the Data Inspector or is separate on your page is your choice to make.

The closest that the Inspector comes to dealing with Arrays is in showing one choice of many given in an Array. In the Data Inspector sample, Data Inspector, select a node such as “Gamma” and you will see the current state as well as a drop-down list of choices.

That is clearly not what you want, because it still follows the design of having only a single property-value pair per row. But if you really want to extend the Data Inspector to implement support for Arrays (and nested Arrays?), you can, because the complete implementation is there in the extensions/DataInspector.* files.