Рендеринг x3d indexedfacset с ember. js - PullRequest
0 голосов
/ 31 марта 2020

Я использовал x3d в ​​Ember Cli Framework. В старой версии Ember Framework все работает хорошо. Я недавно обновил ember. js. После обновления ember. js можно без проблем отобразить idexedfaceset или indexedlineset в сцене x3d с самого начала приложения ember. Но теперь возникает проблема добавления idexedfaceset или indexedlineset к сцене после полной загрузки приложения. Например, см. Код ниже. Если для отображаемого значения установлено значение true, при нажатии кнопки приложение выдает ошибку:
Uncaught TypeError: Невозможно прочитать свойство 'getPoints' с нулевым значением в x3dom.registerNodeType.defineClass.nodeChanged.nodeChanged (x3dom-full. js: 4596)

Я понимаю, что ошибка указывает на то, что тег координат отсутствует в тот момент, когда x3d обнаруживает добавление узла и пытается его визуализировать. После этого я проверяю код html и тег координат находится там, где он должен быть. Но элемент не отображается в сцене x3d. Кажется, что добавление тега координаты приводит к небольшой задержке.
Я знаю, что можно отобразить элемент, используя jquery запятую как $ ("# scene"). Append ("..."). Но я бы хотел использовать поведение ember, потому что мне больше нравится вычислять позиции и размеры. Я был бы счастлив, если бы кто-то мог помочь решить проблему. Большое спасибо.

//application.hbs
{{#if this.display}}
  <transform>
    <shape def="" ispickable="0" bboxsize="-1,-1,-1" bboxcenter="0,0,0" render="true">
      <appearance sorttype="auto" alphaclipthreshold="0.1">
        <material specularcolor="0,0,0" shininess="0.2" emissivecolor="0,0,0" ambientintensity="0.2" transparency="0.5" diffusecolor="0 0 1">
        </material>
      </appearance>
      <indexedfaceset ccw="true" colorpervertex="false" colorindex=" 0 0 0 0" coordindex="0 3 2 1 0" solid="true" usegeocache="true" lit="true" normalpervertex="true" normalupdatemode="fast" convex="true" >

        <coordinate point="-1 0 0, -1 1 0, 1 1 0, 1 0 0"></coordinate>

        <color color="0 0 1"></color>
      </indexedfaceset>
    </shape>
  </transform>
{{/if}} ```

Ответы [ 2 ]

0 голосов
/ 06 апреля 2020

Очень интересно знать, что остальные посты принадлежат 2014/2015 гг. С июля 2015 года я работаю над этими topi c, и пока все работает хорошо. Сгенерировать сцену x3d с несколькими компонентами ember и без обновления ember не составило труда. ;) Я ожидал некоторых изменений с обновлением ember. Как и вы, я подозреваю, что порядок, в котором узлы создаются / добавляются в DOM, изменился. Для моей сцены по умолчанию я использую атрибут render, чтобы скрывать и показывать элементы с этого момента. Все остальное я буду скрывать и показывать с помощью API x3dom через javascript в @action, пока не будет найдено другое решение. Жаль, что я не могу использовать составные углы, как раньше, потому что я думаю, что они созданы для создания отдельных тегов. Большое спасибо за ваши усилия.

0 голосов
/ 03 апреля 2020

Ваши последние изменения наконец позволили мне запустить проект. Исследуя вашу проблему, я обнаружил похожую проблему

Насколько я могу судить, она не имеет ничего общего с d3 или jquery и имеет отношение к добавлению индексированный набор перед добавлением координаты с использованием функций DOM, которые влияют как на d3, так и на jquery. Добавление координаты к индексированному набору, а затем добавление индексированного набора к остальной части DOM должно работать нормально.

Другой комментатор отметил

Для меня узел еще не существует, так как я создаю DOM из JSON. Решением было сначала создать дочерний узел, затем добавить его к родительскому, а затем добавить родительский. До этого код имел значение d ie в appendChild.

Уровень рендеринга Ember сильно изменился с Ember 1.x -> Ember 3.x. Мне кажется, что изменение порядка, в котором узлы создаются / добавляются в DOM, вызвало эту проблему для вас, так как x3dom ожидает один заказ и вызывает другой.

Первое быстрое решение вашей текущей проблемы - избежать включения <transform> элементов в блоки {{#if}} для скрытия / отображения, поскольку это удаляет / считывает DOM таким образом, что x3dom не распознается из. Скорее, управляйте видимостью с помощью свойства x3dom render

<transform render="{{if this.display "true" "false"}}">
  <shape def="" ispickable="0" bboxsize="-1,-1,-1" bboxcenter="0,0,0" render="true">
    <appearance sorttype="auto" alphaclipthreshold="0.1">
      <material specularcolor="0,0,0" shininess="0.2" emissivecolor="0,0,0" ambientintensity="0.2" transparency="0.5" diffusecolor="0 0 1">
      </material>
    </appearance>
    <indexedfaceset ccw="true" colorpervertex="false" colorindex=" 0 0 0 0" coordindex="0 1 2 3 0" solid="true" usegeocache="true" lit="true" normalpervertex="true" normalupdatemode="fast" convex="true" >

        <coordinate point="-2 -2 0, 0 -2 0, 0 0 0, -2 0 0"></coordinate>

      <color color="0 0 1"></color>
    </indexedfaceset>
  </shape>
</transform>

В качестве альтернативы вам также нужно избегать переноса <transform> в {{#if}} и использовать x3dom API напрямую через javascript в @action.

...