Draft-ProtoVisIntegration40true savefalsenulltruenull true Wikicontroltruetrue ProtoVisDrawing.subclass('DynamicNodeLinkTreeDiagram',{initialize:function($super,parent){$super();this._LKparent=parent;this.setData({});this.isNative=false;},removeCanvas:function(){varc=this.canvas();if(!c||!c.parentNode)return;c.parentNode.removeChild(c);},render:function($super){$super();varself=this;functiontoLively(){vardrawingElems=[];varimporter=newImporter();varshapes=[];functionallChildNodesFrom(node,parent){$A(node.childNodes).each(function(ea){varshape=lively.scene.Shape.importFromNode(importer,ea);if(shape){if(parent)parent.add(shape);elseshapes.push(shape);}drawingElems.push(ea);allChildNodesFrom(ea,(shapeinstanceoflively.scene.Group?shape:undefined));});}allChildNodesFrom(self.vis.$canvas[0].firstChild);vardiagMorph=newMorph(newlively.scene.Group());diagMorph.shape.setFill(null);diagMorph.shape.setStroke(null);diagMorph.shape.rawNode.setAttributeNS(null,'stroke-width','1.5');diagMorph.shape.setContent(shapes);if(self._LKparent)self._LKparent.addMorph(diagMorph);elsediagMorph.openInWorld();self.removeCanvas();}this.isNative&&this._LKparent&&toLively();if(this._LKparent&&this._LKparent.getPosition()){this.setPosition(this._LKparent.getPosition().subPt(pt(3,3)));}},setData:function(newData,rootName){functioncreate(data){varignoreKeys=['_namespace','_namespaces','_layer_object_id','xmlns'];varnode=newpv.Dom.Node;for(varkeyindata){if(!data.hasOwnProperty(key)||ignoreKeys.member(key))continue;varvalue=data[key];varsubNode=node.appendChild((typeofvalue!='object')?newpv.Dom.Node(value):create(value));subNode.nodeName=key;}returnnode;}varroot=create(pv.dom(newData).$map);root.nodeName=rootName||'root';root.nodeValue=null;this._rootNode=root;},createSubNodes:function(node){varsubNode=node.appendChild(newpv.Dom.Node());subNode.nodeName='SubNode';node.nodeValue=null;},draw:function(){varself=this;varw=(this._LKparent&&this._LKparent.getExtent())?this._LKparent.getExtent().x-4:400,h=(this._LKparent&&this._LKparent.getExtent())?this._LKparent.getExtent().y-4:650;varroot=this._rootNode;varvis=newpv.Panel().width(w).height(h).margin(5).fillStyle("white").event("mousedown",pv.Behavior.pan()).event("mousewheel",pv.Behavior.zoom());varpartition=vis.add(pv.Layout.Partition.Fill).nodes(function(){returnroot.nodes()}).size(function(d){returnd.firstChild?0:1;}).order("descending").orient("radial");partition.node.add(pv.Wedge).fillStyle(pv.Colors.category19().by(function(d){if(d.toggled)returnd.parentNode&&d.parentNode.parentNode&&d.parentNode.parentNode.nodeName;elsereturnd.parentNode&&d.parentNode.nodeName;})).strokeStyle("#fff").lineWidth(.5).event("click",function(){selectedNode=this;if(this.data().parentNode)returntoggle(this.data())});partition.label.add(pv.Label).visible(function(d){returnd.angle*d.outerRadius>=6;}).font('14pxHelvetica');functiontoggle(n){n.toggle(pv.event.altKey);returnpartition.reset().root;}root.nodes().each(function(ea,i){if(i!=0)ea.toggle();});returnvis;},});= 6; })\n\t\t\t.font('14px Helvetica');\n\n\t\tfunction toggle(n) {\n\t\t\tn.toggle(pv.event.altKey);\n\t\t\treturn partition.reset().root;\n\t\t}\n\n\t\troot.nodes().each(function(ea, i) {\n\t\t\tif (i != 0)\n\t\t\t\tea.toggle();\n\t\t});\n\n\t\treturn vis;\n\t},\n});"]]>= 6; })\n\t\t\t.font('14px Helvetica');\n\n\t\tfunction toggle(n) {\n\t\t\tn.toggle(pv.event.altKey);\n\t\t\treturn partition.reset().root;\n\t\t}\n\n\t\troot.nodes().each(function(ea, i) {\n\t\t\tif (i != 0)\n\t\t\t\tea.toggle();\n\t\t});\n\n\t\treturn vis;\n\t},\n});"]]>truetruefalse 45truetrue false0.3678423833405050.11 true false true nullfalsetruenull Workspacefalsenulltruefalse Xfalsenulltrue false false Mfalsenulltrue false false –falsenulltrue false falsenullfalsefalsenullnullnullnullfalse data={a:1,b:2,c:3,d:{e:4,f:5,g:{h:6,i:7,j:8}}}if(typeofgraph!='undefined'){graph.remove();deletegraph;}graph=newDynamicNodeLinkTreeDiagram($morph('ProtoVisContainer'));graph.setData(data);graph.render();/*graph.remove();*/truetruefalse truetrue false00.11 true false true nullfalsetruenull Workspacefalsenulltruefalse Xfalsenulltrue false false Mfalsenulltrue false false –falsenulltrue false falsenullfalsefalsenullnullnullnullfalse null233