D3, обновляющий DOM, но ничего не показывает

Я строю диаграмму, ориентированную на силу, и насколько я могу судить, я правильно написал код. DOM выглядит сразу после запуска этого кода. И все же ничего не отображается.D3, обновляющий DOM, но ничего не показывает

var type_node_list = typeNodes(data); 
shuffle(type_node_list); 
initializePosition(type_node_list); 

var links = typeLinks(type_node_list); 

var svg = d3.select('#root'); 

var link = svg 
    .append('g') 
    .attr('id', 'links') 
    .selectAll('line') 
    .data(links) 
    .enter() 
    .append('line') 
    .attr('class', 'link'); 

var type_nodes = svg 
    .append('g') 
    .attr('id', 'nodes') 
    .selectAll('.node') 
    .data(type_node_list) 
    .enter() 
    .append(createTypeNode); 

function updateTypeNodeLocations() { 
    link 
     .attr("x1", function(d){return d.source.x;}) 
     .attr("y1", function(d){return d.source.y;}) 
     .attr("x2", function(d){return d.target.x;}) 
     .attr("y2", function(d){return d.target.y;}); 

    type_nodes 
     .attr('x', nodeX) 
     .attr('y', nodeY); 
} 
updateTypeNodeLocations(); 
/* 
var position_the_types = d3.forceSimulation() 
    .nodes(type_node_list) 
    .force("charge",d3.forceManyBody().strength(-10)) 
    ; 
position_the_types.on('tick',updateTypeNodeLocations()); 
*/

Часть моделирования закомментирована, потому что я пытаюсь заставить первую часть работать. Когда я раскомментирую его, он только один раз вызывает событие «tick», хотя обработка явно не завершена. И в консоли JavaScript нет ничего, чтобы объяснить это.

См. http://jsfiddle.net/jarrowwx/gof5knaj/36/ для получения полного кода.

У меня были работы сегодня утром, и что-то изменилось, и теперь я ничего не работаю. Я проверил D3 github, и последняя фиксация, похоже, была 11 дней назад, поэтому это вряд ли вызвано изменением библиотеки.

Испытывал ли кто-нибудь подобное раньше? Любые указания на то, что я делаю неправильно? Я обнаружил ошибку D3?

источник

2016-11-15 John Arrowwood

Когда я бегу на скрипке, я вижу много цветных кругов с фигурами в Я должен увидеть что-то еще? –

При вызове 'position_the_types.on ('tick', updateTypeNodeLocations()); вы фактически передаете возвращаемое значение функции' updateTypeNodeLocations' как обратный вызов, который не тот, который вы хотите. Вам нужно просто передать ссылку на функцию вместо ее вызова: 'position_the_types.on ('tick', updateTypeNodeLocations);' без внутренних скобок. Если это так, возможно, стоит даже рассмотреть вопрос об удалении этого вопроса. – altocumulus

@altocumulus, Вы правы в посторонних парнах. DOH! Что решает проблему тика. Но даже после этого я ничего не вижу. –

Проблема заключается в моей функции createTypeNode.

Я создал элемент изображения через: document.createElement('image'). Это не работает. Чтобы создать изображение через JavaScript, нужно использовать Пространства имен.

См:. Programmatically creating an SVG image element with javascript

источник

2016-11-16 03:16:28

D3, обновляющий DOM, но ничего не показывает

ответ

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