2016-02-04 3 views
0

Я встаю, чтобы ускориться с D3 и наткнулся на отличный скрипт, который связывает узлы с эллиптическими дугами. Все, что я пытаюсь (и не могу) достичь, это создать круг и оживить его так, чтобы он проходил вдоль дуги между двумя узлами - между узлом А и узлом В.D3: живой круг между двумя узлами

Я думаю, что моя проблема в том, что я не имея возможности правильно ссылаться на дуги (или «ссылки»). Кусок кода, который должен делать это следующим образом:

ОБНОВЛЕНО --------

var pathx = d3.select("path#A->B"), 

Я думаю, что я почти там. Пожалуйста, найдите jsfiddle до сих пор - бит, который должен анимировать круг, можно найти между тегами //animations и //end animations. http://jsfiddle.net/Guill84/uxy8d9vs/3/

Я в основном пытаюсь адаптировать этот рабочий пример здесь: http://bl.ocks.org/KoGor/8162640

+2

это может помочь вам http://bl.ocks.org/KoGor/8162640 – Cyril

+2

'd3.select (" путь # 1 ")', '# 1' - это элемент с идентификатором' 1', во-первых, '1' не является допустимым именем id (spec говорит, что он должен начинаться с буквы), во-вторых, ни один из ваших путей не имеет идентификаторов. Что вы там делали? – Mark

+0

Отметьте, пожалуйста, свой ответ. Я изменил сценарий так, что (1) все дуги имеют идентификатор (проверены и теперь работают) и (2), что все идентификаторы имеют действительное имя (должно начинаться с буквы). Я все еще не могу выбрать нужный путь, скажем, путь с идентификатором «# A-> B» ... Кирилл - спасибо вам, это, безусловно, сценарий, который мне нужен, и я реализовал его в своем последнем jsfiddle http : //jsfiddle.net/Guill84/uxy8d9vs/3/. Я очень близок к этому, но, как вы можете видеть выше, я все еще не могу выбрать дугу, которая мне нужна для анимации, – Noobster

ответ

0

Причины я не мог получить анимацию для работы потому, что сценарий был запущен до того, как дома закончил нагружать ...

Отсрочка анимации на секунду или около того решила проблему. Удивленный D3 не может справиться с этим лучше, хотя.