I want to add rounded rectangle in mxGraph based on JSON object

Question

I want to add rounded rectangle in mxGraph based on JSON object. I have a JSON object through which I want to update mxGraph toolbar object accordingly. In my JSON object, I want to update mxGraph on the basis of that.

Here is my jQuery code through which I want to update mxGraph toolbar:

function LoadWorkFlow(key, toolbarOptions, content) {
var $xml = "";
$.ajax({
    type: "GET",
    url: "./config/diagrameditor.xml",
    async: false,
    dataType: "xml",
    success: function (d) {
        console.log(d);
        // var xmldoc = $.parseXML(d);
        $xml = $(d);

    }
});

$xml = $xml.find("mxEditor");
console.log($xml);
var $Array = $xml.find("Array");
var $add = $($Array).find("add")[0];
$added = $($add).clone();
console.log($added.html());
$.each(toolbarOptions, function (i, toolbarButton) {
    var name = "";
    var type = "";
    if (typeof (toolbarButton) == "string") {
        name = toolbarButton;
        type = "RoundRect";
    } else {
        name = toolbarButton.name;
        type = toolbarButton.type;
    }
});
$xml.find("Array").html($Array.html());

var container = document.getElementById("graph");
var toolbar = document.getElementById('toolbar');
var graph = new mxGraph(container);
var $root = $xml.find("add");
console.log($($add)[0].outerHTML);
var diagram = mxUtils.parseXml($($root)[0].outerHTML);
var codec = new mxCodec(diagram);
var $toolbar = $xml.find("mxDefaultToolbar");
codec.decode(diagram.documentElement, graph.getModel());
graph.fit();

createEditor('./config/diagrameditor.xml');
}

$(document).ready(function () {

  var toolbarOptions = ["Purchase", "Sale", "Quality"];
  LoadWorkFlow("", toolbarOptions, "");
}

Here is my sample JSON. According to this, I want to update my mxGraph Toolbar with rounded rectangle:

[{
    "reportingDepartment": "guardFile",
    "departmentName": "2",
    "designationHeadDepartment": "sdf"
},

{
    "reportingDepartment": "purchase",
    "departmentName": "3",
    "designationHeadDepartment": "ert"
}]

Here is my XML of diagram editor. I want to update <add as="---reporting value from JSON---"></add> and the the below tag content along with it through jQuery.

<Array as="templates">
    <add as="group">
        <Group label="" href="">
            <mxCell vertex="1" style="group" connectable="0"/>
        </Group>
    </add>
    <add as="connector">
        <Connector label="" href="">
            <mxCell edge="1">
                <mxGeometry as="geometry" relative="1"/>
            </mxCell>
        </Connector>
    </add>
  </Array>