Почему D3.layout.force не запускается правильно?

Я создаю график, используя механизм layout.force d3 для графического макета с ориентацией по силе.Почему D3.layout.force не запускается правильно?

Некоторое время он работал, но теперь, когда я выполняю функцию start(), ничего не происходит. Я раздел мой код сводится к следующему:

var svg = d3.select("#field_d3").append("svg"); 
    var width = 720; 
    var height = 640; 
    svg.attr("width", width) 
     .attr("height", height); 
    var nodes = [ 
     {nid: "node1", x: width/2, y: height/2}, 
     {nid: "node2", x: width/2, y: height/2}, 
     {nid: "node3", x: width/2, y: height/2} 
    ]; 

    var links = [ 
     { source: 0, target: 1}, 
     { source: 1, target: 2}]; 

    var force = d3.layout.force() 
     .nodes(nodes) 
     .links(links) 
     .size([width, height]) 
     .linkStrength(0.9) 
     .friction(0.9) 
     .linkDistance(100) 
     .charge(-30) 
     .gravity(0.1) 
     .alpha(0.2); 

    console.log("Force layout initilized", force); 
    force.on('end', function() { 
     console.log("Force Layout calculations complete"); 
    }); 

    force.on('start', function() { 
     console.log("Force layout started"); 
    }); 

    force.on('tick', function() { 
     console.log("Force layout is ticking"); 
    }); 

    console.log("Starting force layout", force); 
    force.start(); 
    //------------ 
    console.log("Now after all force layout code");

field_d3 является DIV с идентификатором = field_d3.

Но все, что я вижу в консоли

Force layout initilized Object {} 
Starting force layout Object {} 
Now after all force layout code

С ни один из начала, конца, или отметьте функции при вызове. Что происходит не так?

источник

2016-06-15 GreySage

@echonax сниппета при условии является очень хорошим примером для [mcve]; он разделяется до минимума и содержит весь код, необходимый для решения этой проблемы. Круги и линии - это просто графические представления вычисленных значений и не являются существенными для этой проблемы. То же самое относится и к функции 'tick()', которая для этого вопроса не должна быть более подробной, чем запись журнала. Престижность @GreySage, который прилагал усилия, чтобы обеспечить хороший пример. Хотя он предпочтительно должен быть помещен в исполняемый фрагмент Stack Snippet, JSFiddle или тому подобное ;-) – altocumulus

[That] (http://stackoverflow.com/questions/37843476/why-doesnt-d3-layout-force-doesnt- start-correct # comment63165649_37843476) сказал, что он отлично работает для меня, если я поместил код в [JSFiddle] (https://jsfiddle.net/3et3aee6/). Все журналы из функций 'start',' tick' и 'end' печатаются, как ожидалось. – altocumulus

@altocumulus О, извините, я не очень внимательно изучил вопрос. Я думал, что OP означает, что на экране ничего не появляется, но на самом деле спрашивали о силовых функциях :) – echonax

Вы лишили настройки значений ширины и высоты, которые останавливают выполнение макета силы (они оба будут неопределенными). Он работает, когда вы вставляете их обратно.

var width = 500; 
var height = 500;

http://jsfiddle.net/jw2z814e/

источник

2016-06-15 21:24:53 mgraham

Извините, это было плохо. Я фактически установил эти переменные, я просто не включил его в код, так как он был выше, чем все остальное. Я отредактирую свой вопрос. – GreySage

Почему D3.layout.force не запускается правильно?

ответ

Смежные вопросы