jQueryのガントチャート - 私はgantviewのjQueryプラグイン （<a href="https://github.com/thegrubbsian/jquery.ganttView" rel="nofollow">https://github.com/thegrubbsian/jquery.ganttView</a>）を使用しようとしたデータ

Question

を適用

ので、必要なデータが似ている：

{ 
     id: 1, name: "Feature 1", series: [ 
      { name: "Planned", start: new Date(2010,00,01), end: new Date(2010,00,03) }, 
      { name: "Actual", start: new Date(2010,00,02), end: new Date(2010,00,05), color: "#f0f0f0" } 
     ] 
    }, 
    { 
     id: 2, name: "Feature 2", series: [ 
      { name: "Planned", start: new Date(2010,00,05), end: new Date(2010,00,20) }, 
      { name: "Actual", start: new Date(2010,00,06), end: new Date(2010,00,17), color: "#f0f0f0" }, 
      { name: "Projected", start: new Date(2010,00,06), end: new Date(2010,00,17), color: "#e0e0e0" } 
     ] 
    }, 
    { 
     id: 3, name: "Feature 3", series: [ 
      { name: "Planned", start: new Date(2010,00,11), end: new Date(2010,01,03) }, 
      { name: "Actual", start: new Date(2010,00,15), end: new Date(2010,01,03), color: "#f0f0f0" } 
     ] 
    }, 
    { 
     id: 4, name: "Feature 4", series: [ 
      { name: "Planned", start: new Date(2010,01,01), end: new Date(2010,01,03) }, 
      { name: "Actual", start: new Date(2010,01,01), end: new Date(2010,01,05), color: "#f0f0f0" } 
     ] 
    } 

[OK]を私は、だから私はそれを構築し、そのJSON :-)だと思いますPHPで、私のfuncs出力は次のようになります。もちろん

SERIES DATA 
Array 
(
    [name] => Krank 
    [start] => 1317420000 
    [end] => 1320102000 
) 
DATA 
Array 
(
    [id] => 1 
    [name] => 15 
    [series] => Array 
     (
      [name] => Krank 
      [start] => 1317420000 
      [end] => 1320102000 
     ) 

) 
JSON 
{"id":1,"name":15,"series":{"name":"Krank","start":1317420000,"end":1320102000}} 

私はプラグインにのみJSONの一部を提出;）

私は配列を作成し、それをjsonにエンコードします。

このデータでは、プラグインは機能しません。私はどのようにPHPでこのデータを再構築するか分かりません。

いくつかのヒント？ ;）ここで

Answer 1

は、いくつかの回避策である：http://dhanushkaat.blogspot.com/2011/01/jquery-gantt-chart.html

Answer 2

jquery.ganttViewのソースコードと、いくつかの試行錯誤を読んだ後、私は、データがによって供給されたとき、開始と終了ははYmdとMDY形式を受け入れることがわかっ（dataUrl代わりのデータを使用して）外部URL：

$(function() { 
     $("#ganttChart").ganttView({ 
      dataUrl: 'data.json', 
      slideWidth: 900, 
      behavior: { 
       onClick: function (data) { 
        var msg = "You clicked on an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }"; 
        $("#eventMessage").text(msg); 
       }, 
       onResize: function (data) { 
        var msg = "You resized an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }"; 
        $("#eventMessage").text(msg); 
       }, 
       onDrag: function (data) { 
        var msg = "You dragged an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }"; 
        $("#eventMessage").text(msg); 
       } 
      } 
     }); 

    }); 

データの例：

[ 
{ 
    "id": "1", "name": "Feature 1", "series": [ 
     { "name": "Planned", "start": "2010-01-01", "end": "2010-01-03" }, 
     { "name": "Actual", "start": "2010-01-02", "end": "2010-01-05", "color": "#f0f0f0" } 
    ] 
}, 
{ 
    "id": "2", "name": "Feature 2", "series": [ 
     { "name": "Planned", "start": "2010-01-05", "end": "2010-01-20" }, 
     { "name": "Actual", "start": "2010-01-06", "end": "2010-01-17", "color": "#f0f0f0" }, 
     { "name": "Projected", "start": "2010-01-06", "end": "2010-01-17", "color": "#e0e0e0" } 
    ] 
}]