2014-03-27 34 views
1

我正在使用dhtmlxGantt從數據庫中生成甘特圖。我已經完成了教程,並且內嵌圖表顯示正常。然後,當我從數據庫拉入數據時,html頁面超時並不顯示任何內容。dhtmlx甘特圖不能從數據庫加載

如果我加載data.php文件,它立即顯示數據庫中的數據。我發現,如果我嘗試並顯示內嵌數據和數據庫數據,則內聯立即加載,然後大約8秒鐘後,數據庫表中的數據加載?此外,數據庫數據的鏈接不顯示。任何人都可以幫忙嗎?從myGantt.html

代碼:

<!DOCTYPE html> 
<html> 
<style type="text/css" media="screen"> 
    html, body{ 
     margin:10px; 
     padding:0px; 
     height:100%; 
     overflow:hidden; 
    } 
</style> 
<head> 
    <title>How to Start with dhtmlxGantt</title> 
    <script src="codebase/dhtmlxgantt.js"></script> 
    <link href="codebase/dhtmlxgantt.css" rel="stylesheet"> 
</head> 
<body> 
    <div id="gantt_here" style='width:1000px; height:400px;'></div> 
    <script type="text/javascript"> 
    var tasks = { 
    data:[ 
     {id:1, text:"Test Project 1",start_date:"01-04-2013", duration:35, 
     progress: 0.1, open: true}, 
     {id:2, text:"Wire Framing", start_date:"03-04-2013", duration:5, 
     progress: 0, open: true, parent:1}, 
     {id:3, text:"Design", start_date:"10-04-2013", duration:20, 
     progress: 0.0, open: true, parent:1}, 
     {id:4, text:"Database Design", start_date:"10-04-2013", duration:5, 
     progress: 0, open: true, parent:1}, 
     {id:5, text:"System Set up", start_date:"11-04-2013", duration:2, 
     progress: 0.0, open: true, parent:1}, 
     {id:6, text:"System Presentation", start_date:"24-04-2013", duration:1, 
     progress: 0.0, open: true, parent:1}, 
    {id:7, text:"Testing", start_date:"25-04-2013", duration:5, 
     progress: 0.0, open: true, parent:1}, 
    {id:8, text:"Bug Fixing", start_date:"30-04-2013", duration:5, 
     progress: 0.0, open: true, parent:1}, 
    {id:9, text:"Beta Launch", start_date:"05-05-2013", duration:1, 
     progress: 0.0, open: true, parent:1} 
    ], 
    links:[ 
     {id:1, source:1, target:2, type:"1"}, 
     {id:2, source:1, target:3, type:"1"}, 
     {id:3, source:1, target:4, type:"1"}, 
     {id:4, source:1, target:5, type:"1"}, 
     {id:5, source:1, target:6, type:"1"}, 
    {id:6, source:1, target:7, type:"1"}, 
    {id:7, source:1, target:8, type:"1"}, 
    {id:8, source:1, target:9, type:"1"} 
    ] 
}; 
// gantt.config.xml_date = "%Y-%m-%d %H:%i"; 

    gantt.init("gantt_here"); 
    gantt.parse(tasks); 
      gantt.load("data.php"); 
// var dp=new dataProcessor("data.php"); 
// dp.init(gantt); 

    </script> 

    </body> 
</html> 

的data.php文件是:

<?php 


define('DB_USER','projects_test'); 
define('DB_PASS','user_pass'); 
define('DB_HOST','localhost'); 

include ('codebase/connector/gantt_connector.php'); 
// include ("./config.php"); 

$res=mysql_connect(DB_HOST,DB_USER,DB_PASS) or die ("Unable to connect!"); 
mysql_select_db("projects_test"); 

$gantt = new JSONGanttConnector($res); 

$gantt->render_links("gantt_links","id","source,target,type"); 

$gantt->render_table(
    "gantt_tasks", 
    "id", 
    "start_date,duration,text,progress,sortorder,parent"  
); 

?> 

到php文件的鏈接是: http://dev.subzerostudio.com/dhtmlxGantt/data.php

輸出可以看出at:

http://dev.subzerostudio.com/dhtmlxGantt/myGantt.html

回答

0

你的問題是因爲有很多數據要加載。當你加載你的數據時肯定是一個問題。看看你的div類「gantt_task_row」和gannt_task_row_odd「有近39000個節點... 在教程上,給出參數」json「來解析,也許這是你問題的根源

+0

嗨昆廷 - 我從數據庫加載和2臺分別有9分8的記錄。如果使用data.php運行鏈接,你可以看到數據庫輸出 - 所以不知道39,000個節點來自哪裏?謝謝Nigel –

+0

你可以嘗試只使用js數據,並且只能使用你的DataBase中的數據。我很確定你的問題是因爲框架/解析器不能很好地理解你的數據 – jadok

+0

嗨,Quentin - 數據庫結構與示例中的完全相同,所以沒有理由解釋器不理解數據。我與其他表使用現有的數據庫。現在我創建了一個名爲'gantt'的數據庫,並使用第5步中的代碼創建了兩個表。然後我填充了少量有效數據 - 因此它應該可以工作...... –

0

如果其他人有我找到了同樣的問題並解決了這兩個問題。我無法從數據庫中獲取數據的原因很簡單,就是我爲所有條目設置了父節點爲1 - 將第一個節點更改爲0解決了問題。

延遲8秒鐘的事實是,數據是從內聯元素中提取的,db和日期格式不同,因此甘特試圖顯示超過100年的數據..... ..

所有正在工作。

+0

id的根節點可以在配置中更改,例如gantt.config.root_id = 1; http://docs.dhtmlx.com/gantt/api__gantt_root_id_config.html 關於延遲,目前甘特圖有兩個設置可以加速渲染大數據集。 簡化時間軸佈局: http://docs.dhtmlx.com/gantt/api__gantt_show_task_cells_config.html或http://docs.dhtmlx.com/gantt/api__gantt_static_background_config.html 動態加載: HTTP://docs.dhtmlx。 COM /甘特圖/ api__gantt_branch_loading_config.html – Paul