Узлы NGX-Graph становятся черными при использовании третьего свойства

Question

Я пытаюсь создать дерево кроны, используя ngx-graph, и связать каждый узел со всплывающим окном, поэтому я выбрал "@material-extended / mde", проблема в том, что я пытаюсь определить всплывающее содержимое по узлам, поэтому я попытался использовать свойство " данные ". Но всякий раз, когда я добавляю к узлам какое-либо новое свойство (кроме идентификатора и метки), синтаксический анализ не выполняется, и все узлы становятся черными.

Есть ли способ заставить всплывающее содержимое работать, я планирую добавить во всплывающее окно формы и сетки данных в зависимости от узла?

Вот ссылка на stackblitz, над которым я работаю

Он всегда не работает на узле с дополнительным полем, поэтому я подумал, что это должна быть проблема синтаксического анализа, или структура узла предопределена и не может иметь граф с более чем двумя полями (идентификатор и метка).

Answer 1

Установив node.data = 'testdata' вы перезаписываете оригинал node.data свойство, которое используется в примере для node.data.color.

Чтобы решить вашу проблему, вы можете определить объект данных и создать собственное свойство внутри

Например

Составная часть:

{
    id: 'First',
    label: '12/10/2012 - 12/10/2013',
    data: { tooltip:'First testdata' }
  }

HTML:

 <mat-card-content>
     Here goes data form/data grid {{node.data?.tooltip}}
 </mat-card-content>

Вот рабочий Stackblitz.

---

Однако node.data уже используется ngx-graph mabye, вы хотите определить собственное свойство, чтобы избежать каких-либо побочных эффектов.

Например

Составная часть:

{
    id: 'First',
    label: '12/10/2012 - 12/10/2013',
    tooltip:'First testdata'
  }

HTML:

 <mat-card-content>
     Here goes data form/data grid {{node.tooltip}}
 </mat-card-content>