JQuery GanttChart – 应用数据

我试图使用gantview jquery插件（ https://github.com/thegrubbsian/jquery.ganttView ）

所以需要的数据如下：

{ 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" } ] } 

好吧我认为它的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的源代码和一些反复试验之后，我发现当数据由外部URL提供时，使用dataUrl而不是数据，Ymd和mdY中的开始和结束接受格式：

 $(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" } ] }]