javascript - adding nodes to tree force layout - almost working -


I am working with force layout and tree hierarchy.

It almost works and its add nodes and links, but they are not visible, maybe I'm missing something trivial, but I have spent many hours on this ... any help greatly appreciated is.

In this ridicule, after clicking, the third node should be added to the root. 

  var width = 960, height = 500, root; Var strength = D3 Layout. Force () Link (80). Charge (-320). Guruvita (0.05). Size ([width, height]). On ("Tic", Tic); Var svg = d3.select ("# myviz"). Attached ("svg") .attr ("width", width) .attr ("height", height); Var link = svg.selectAll (".link"), node = svg.selectAll (".node"); Var mydata = '{"name": "start_bubble", "children": [{"name": "child_O1", "size": 31812}, {"name": "child_O2", "size": 31812}] } '; Var myadd = '{"name": "new_child", "size": 100}'; Root = JSON.parse (mydata); Mydadars = JSON Pars (maid); Updates(); force start(); Function Update () {var nodes = flatten (root), link = D3 Layout .ree () Links (nodes); // Restart the Force Layout. Force Node (Nodes) Link (link). Start (); // Update Link Link = link.data (link, function (d) {return d.target.id;}); . Link.exit () removal (); Link () ".Update nodes node = node data (nodes, function (d) {return daid;}); .display node.exit (); var node enter = node.enter () .app ("G") .attr ("class", "node") .on (click "click"). Call (force.drag); NodeEnter.append ("circle") .attr ("r", Function (d) {return math.Sqrt (d.size) / 5 || 14.5;}); NodeEnter.append ("text") .attr ("dy", "2.3em") .text (function (d) {Return d.name;}); node selection ("circle") style ("fill", color); loud start ();} function tick () {link.attr ("x1", function (d ) {Return d.source.x;}) .attr ("y1", function (d) {return d.source.y;}). Etter ("x2", function (d) { Sign d.target.x;}) .attr ("y2", function (d) {returns d.target.y;}); Node.attr ("transform", function (d) {return "translation (" + + Dx + "," + dy + ")";});} function color (d) {returns d._children? "# 3182bd" // compressed package: d.children? "# C6dbef" // Extended package: " # FD8D3C "; // Lead node} // Click Toggle to Function of Children Click on Function (D) {if (d3.event.defaultPrevented) Return; // Avoid Drag If (d.children) {// d._children = d.children; Remove for testing // d.children = null; Root removed for testing. Children [2] = myaddparsed; // add third node} and {// d.children = d._children; Removed for Tesing // d._children = null; Root removed for testing. Children [2] = myaddparsed; // third node} update () add; } // Returns the list of all nodes under the root. Function flatten (root) {var nodes = [], i = 0; Function recurs (node) {if (node. Children) node. children. Ex (recurs); If (! Node.id) node.id = ++ i; Nodes.push (node); } Rikers (Route); Return nodes; }

You come on stackoverflow, And you say: "I index my data with the value of i in Rickers ." But you do not maintain the value between the call of flatten . You do not provide the specificity. You can not tell D3 that you have new data instead, you i to 0, increment it with ++ i , set it to your new element, and ask D3 to find out that your new element is actually New When you have second element with 1 code equal to id

By dragging it can prevent it from resetting to zero. Here is a .


Comments

Post a Comment

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

I'm having trouble overriding a ModelForm save method. I get this error I'm: Exception type: TypeErier Exception Value: Save () found an unexpected keyword argument 'committed' My intentions include a form 3 fields Submit several values ​​for, then create an object for each combination of those areas, and to save each object file models.py class collarsult type (models.Model): id = model. AutoField (db_column = 'icontact_result_code_type_id', primary_key = true) callResult = models.ForeignKey ( 'CallResult', db_column = 'icontact_result_code_id') campaign = models.ForeignKey ( 'campaign', db_column = 'icampaign_id') CALLTYPE = models.ForeignKey ( 'CALLTYPE', db_column = 'icall_type_id') agent = models.BooleanField (db_column = 'bagent', default = true) teamLeader = models.BooleanField (db_column = 'bTeamLeader', default = true) active = models.BooleanField (db_column = Django.form...
Read more

html - CSS autoheight, but fit content to height of div -

I have a div in which there are three children- div in the left and middle div: float: left while true: float: true because it is my layout Actually will spoil, I've used ClearFix Hack: .cf {zoom: 1; }. Cf: First,. Cf: {content: ""; Display: Table; }. Cf: After {clear: both; } It still works, but I want to be the right div an indicator. So it should fill 100% of the parent unit of height. How can I complete this? PS is the full code: & Lt; / Div & gt; & Lt; Div class = "mobile_content" & gt; & Lt; H5 & gt; {{Data.titel}} & lt; / H5> & Lt; Table & gt; & Lt; TR & gt; & Lt; Th & gt; Komponist: & lt; / Th & gt; & Lt; TD & gt; {{Data.komponist}} & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; Th & gt; Instrument: & lt; / Th & gt; & Lt; TD & gt; {{Data.instrumente}} & lt; / TD & gt; & Lt; / TR & gt;...
Read more

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -

I have been trying to use Qt5 multimedia to record audio with QAudioInput, however, when I see If QAudioInput is started, it increases the master volume of my sound device to 100%. How can I prevent QAudioInput from changing the master volume? My current development platform is Linux with PalsAdio (with flat audio disabled). How can I use QAudioInput : QAudioDeviceInfo device_info = QAudioDeviceInfo :: defaultInputDevice (); QAudio format format; Format.setSampleRate (44100); Format.setChannelCount (1); Format.setSampleSize (16); Format.setCodec ("Audio / PCM"); Format.setSampleType (QAudioFormat :: SignedInt); Format.setByteOrder (QAudioFormat :: LittleEndian); Std :: cout & lt; & Lt; Device_info.deviceName (). ToUtf8 (). ConstData () & lt; & Lt; Std :: endl; QAudioInput * default_device = new QAudioInput (device_info, format); QIODevice * default_io_device = default_device-> Start (); a QAudioInput.setVolume () method is not you I ...
Read more