Как я могу преобразовать простой тестовый код orgchart в 3-х веточное дерево в нижестоящем размещении JQuery - PullRequest
Новая
       43

Как я могу преобразовать простой тестовый код orgchart в 3-х веточное дерево в нижестоящем размещении JQuery

0 голосов
/ 08 ноября 2019

Я использую orgChart jQuery для отображения дерева MLM с 3-мя ножками и размещением вниз. Исходный код и демо: https://www.jqueryscript.net/chart-graph/Create-An-Editable-Organization-Chart-with-jQuery-orgChart-Plugin.html

Все работает нормально, за исключением позиций узлов (LEFT, Right, Middle). Как я могу справиться с этим? В данный момент он отображает случайный (в порядке очереди)

И если для этого узла в json нет значения, оставьте пустое поле. текущее дерево: https://imgur.com/yYPAknN

Я установил предел, что каждый узел может иметь максимум 3 дочерних элемента. Теперь я просто хочу, чтобы все три узла были ограничены L (слева) M (в середине) R (справа) НЕ MRL илиRLM или RML и т. Д.

Мой Json и скрипт: 

[
  {
    "id": "fawad1", 
    "name": "fawad1", 
    "parent": 0, 
    "position": "M"
  }, 
  {
    "id": "fawad4", 
    "name": "fawad4", 
    "parent": "fawad1", 
    "position": "L"
  }, 
  {
    "id": "fawad4c", 
    "name": "fawad4c", 
    "parent": "fawad4", 
    "position": "R"
  }, 
  {
    "id": "fluffy", 
    "name": "fluffy", 
    "parent": "fawad4c", 
    "position": "L"
  }, 
  {
    "id": "fawad4b", 
    "name": "fawad4b", 
    "parent": "fawad4", 
    "position": "M"
  }, 
  {
    "id": "fawad4a", 
    "name": "fawad4a", 
    "parent": "fawad4", 
    "position": "L"
  }, 
  {
    "id": "fawad3", 
    "name": "fawad3", 
    "parent": "fawad1", 
    "position": "M"
  }, 
  {
    "id": "fawad3c", 
    "name": "fawad3c", 
    "parent": "fawad3", 
    "position": "R"
  }, 
  {
    "id": "fawad3b", 
    "name": "fawad3b", 
    "parent": "fawad3", 
    "position": "M"
  }, 
  {
    "id": "fawad3a", 
    "name": "fawad3a", 
    "parent": "fawad3", 
    "position": "L"
  }, 
  {
    "id": "fawad2", 
    "name": "fawad2", 
    "parent": "fawad1", 
    "position": "R"
  }, 
  {
    "id": "fawad2c", 
    "name": "fawad2c", 
    "parent": "fawad2", 
    "position": "R"
  }, 
  {
    "id": "fawad2b", 
    "name": "fawad2b", 
    "parent": "fawad2", 
    "position": "M"
  }, 
  {
    "id": "fawad2a", 
    "name": "fawad2a", 
    "parent": "fawad2", 
    "position": "L"
  }
]

$(document).ready(function(){   
   var testData = [];
 console.log(testData)
    $.ajax({
           type: "GET", //rest Type
           dataType: 'json', //mispelled
           url: "http://0.0.0.0:8080",
           async: false,
           contentType: "json",
           success: function (msg) {
               console.log("hi")

                     testData=msg; 

           }
});


   $(function(){
       console.log(testData)
       org_chart = $('#orgChart').orgChart({
           data: testData,
           showControls: false,
           allowEdit: false,
           onAddNode: function(node){ 
               log('Created new node on node '+node.data.id);
               org_chart.newNode(node.data.id); 
           },
           onDeleteNode: function(node){
               log('Deleted node '+node.data.id);
               org_chart.deleteNode(node.data.id); 
           },
           onClickNode: function(node){
               log('Clicked node '+node.data.id);
           }

       });
   });
});

Я просто хочу выровнять свое дерево как LMR

...