Проблемы с IndexedFaceSet в X3Dom + D3

Question

Я использую D3 для разметки X3Dom, как в этом примере: http://bl.ocks.org/jbeuckm/5620882

Я преобразовал пример, чтобы использовать простые квадраты вместо блоков: http://bl.ocks.org/jbeuckm/5645205

В более поздней версии я начал загружать данные и вызывать plotAxis и plotData из различных обратных вызовов. Это работает, как и ожидалось, если я нарисую прямоугольники, как в первом примере:

shape.append("x3d:box");

Но когда я заменяю свой набор из 2 треугольников...

shape.append("x3d:indexedFaceSet")
        .attr("coordIndex", "0 1 2 -1  2 3 0 -1")
        .attr('solid', 'false')
        .append("x3d:coordinate")
        .attr("point", "-1 -1 0,  1 -1 0,  1 1 0,  -1 1 0")

это не работает, и я получаю эту ошибку:

Uncaught TypeError: Cannot call method 'getPoints' of null
x3dom.registerNodeType.defineClass.nodeChanged  x3dom.js:3175
x3dom.NodeNameSpace.setupTree  x3dom.js:1929
domEventListener.onNodeInserted  x3dom.js:1296
append  d3.v2.js:3701
d3_selectionPrototype.select  d3.v2.js:3606
d3_selectionPrototype.append  d3.v2.js:3707
plotData  tran_3d.html:132
(anonymous function)  tran_3d.html:240
st.Callbacks.f  jquery-1.9.0.min.js:1
st.Callbacks.p.fireWith  jquery-1.9.0.min.js:1
st.extend.Deferred.st.each.i.(anonymous function)  jquery-1.9.0.min.js:1
(anonymous function)  tran_3d.html:280
d3.json  d3.v2.js:2950
ready  d3.v2.js:2940

Похоже, что "вставленный в узел" код анализирует фигуру до того, как дочерний элемент был добавлен в . Но я не уверен, почему одно и то же добавление будет работать в одном контексте, а не в другом. Опять же, просто добавление x3d: box работает нормально в моей настройке загрузки данных, но x3d: indexedFaceSet выдает ошибку.

Answer 1

Обходной путь - построить узел IndexedFaceSet отдельно, затем сгенерировать строку разметки для узла, а затем использовать файл selection.html (str) D3, чтобы добавить узел к фигуре. В приведенном выше коде "shape" - это выборка узлов, привязанных к данным, поэтому обходной путь выглядит следующим образом:

shape.each(function(d){

   var newNode = "<indexedFaceSet coordIndex="..."><coordinate point="..."/></indexedFaceSet>";

   d3.select(this).html(newNode);
});