使用JSON速度問題劍道UI樹狀

這是工作的罰款，如果我有以防萬一200

節點，但它正在採取太多的時間，如果我有大量數據

檢查這個http://infinitelyinfinite.com/treeview/

這裏是我的jQuery代碼

$.getJSON("/testTree.json", function (data) { 
    $("#treeview").kendoTreeView({ 
     dataSource: data 
    }); 
})

這裏是我JSON文件

[ 
    { 
     "id" :100, 
     "text" :"Region", 
     "items":[ 
      { 
       "id" :1, 
       "text" :"Asia", 
       "parent_id" :100, 
       "items":[ 
        { 
         "id" :2, 
         "text" :"Central Asia", 
         "parent_id" :1, 
         "items":[ 
          { 
           "id" :3, 
           "text":"Afghanistan", 
           "parent_id" :2, 
          }, 
          { 
           "id" :4, 
           "text":"Azerbaijan", 
           "parent_id" :2, 
          } 
         ] 
        }, 
        { 
         "id" :5, 
         "text" :"East Asia", 
         "parent_id" : 1, 
         "items":[ 
          { 
           "id" :6, 
           "text":"China" 
          } 
         ] 
        } 
       ] 
      }, 
      { 
       "id" :7, 
       "text" :"Europe", 
       "parent_id" :100, 
       "items":[ 
        { 
         "id" :8, 
         "text" :"Central Europe", 
         "parent_id" :7, 
         "items":[ 
          { 
           "id" :9, 
           "text" :"Austria", 
           "parent_id" :8, 
           "items":[ 
            { 
             "id" :10, 
             "parent_id" :9, 
             "text":"Carinthia" 
            } 
           ] 
          }, 
          { 
           "id" :11, 
           "text" :"Czech Republic", 
           "parent_id" :8, 
           "items":[ 
            { 
             "id" :12, 
             "text":"Carinthia", 
             "parent_id" :11, 
            } 
           ] 
          } 
         ] 
        } 
       ] 
      } 
     ] 
    } 
]

有沒有什麼辦法讓它快速的樣品??? 它正在採取一些時間三，四十歲

來源

2013-09-22 M.I.T.

您是否需要一次加載完整的樹？你能找回第一大洲，地區，國家......嗎？這將允許發送只需要的數據和HTML渲染將更快。 – OnaBai

@Onbai不，我不想一次加載完整的樹，你可以從這裏下載我的json文件[http://infinitelyinfinite.com/treeview/js/region_tree.json](http://infinitelyinfinite.com/treeview/ js/region_tree.json） –

你的代碼更改爲：

$.getJSON("/testTree.json", function (data) { 
    $("#treeview").kendoTreeView({ 
     dataSource: { 
      data : data 
     } 
    }); 
});

從一個對象，而不是從一個數組初始化數據源似乎要快得多。

在你的網站（一些小的清洗後）將讀取的代碼：

<head> 
    <title> Json Tree</title> 
    <link href="styles/kendo.common.min.css" rel="stylesheet"/> 
    <link href="styles/kendo.default.min.css" rel="stylesheet"/> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/kendo.all.min.js"></script> 
</head> 

<div class="demo-section" style="float:left;"> 
    <h3 class="title">Select Continents</h3> 

    <div id="treeview" class="demo-section"></div> 
</div> 
<body> 
<script type="text/javascript" charset=utf-8> 
    // $(document).ready(function() { 
    $.getJSON("/js/region_tree.json", function (data) { 
     $("#treeview").kendoTreeView({ 
      dataSource : { 
       data: data 
      }, 
      dataTextField : "text", 
      dataValueField: "id" 
     }); 
    }); 

    // }); 
</script> 
</body>

你也可以這樣做：

<script type="text/javascript" charset=utf-8> 
    $(document).ready(function() { 
     var tree = $("#treeview").kendoTreeView({ 
      dataTextField : "text", 
      dataValueField: "id" 
     }).data("kendoTreeView"); 

     $.getJSON("/js/region_tree.json", function (data) { 
      tree.dataSource.data(data); 
     }); 
    }); 
</script>

凡使用getJSON我直接分配讀JSON後它到樹的dataSource。

來源

2013-09-27 08:51:43 OnaBai

我想要這個文件，如果你不介意，我可以使用相同的邏輯在多重選擇在劍道UI？ bdw非常感謝你是人生救世主.... :) –

你想要什麼樣的文件？ AFAIK，這實際上沒有記錄，但是我在與您一起「播放」大量數據時發現了一些內容。這可能是由於數據源中的對象數組和對象造成的某種副作用。但是，這是隻有KendoUI開發人員才能回答的問題... – OnaBai

我可以使用'kendoMultiSelect'的同一個概念嗎？我也想從json文件搜索所以..？ –

使用JSON速度問題劍道UI樹狀

回答

相關問題