AnyGantt 的问题
Issues with AnyGantt
我正在使用 AnyGantt,但我在正确设置它时遇到了问题。
完整代码如下:
var endpoint = '/api/chart/data/'
var label = []
var start = []
var end = []
var werk = []
$.ajax({
method: 'GET',
url: endpoint,
success: function(data){
labels = data.label
start = data.start
end = data.end
uplant = data.werk
var obj = {}
var finalArray = []
for (var i = 1; i <= start.length; i++) {
var first = { id: i, name: uplant[i] }
obj = { ...obj, ...first }
var periods = { id: labels[i], start: start[i - 1], end: end[i - 1] }
if (obj.periods) {
obj.periods.push(periods)
} else {
obj.periods = [periods]
}
finalArray.push(obj)
}
anychart.onDocumentReady(function () {
var data = finalArray;
var treeData = anychart.data.tree(data, "asTable");
chart = anychart.ganttResource();
chart.data(treeData);
chart.getTimeline().scale().minimum("2018-01-01");
chart.getTimeline().scale().maximum("2020-01-01");
var dataGrid = chart.dataGrid();
dataGrid.column(0)
.title('#')
.width(30)
.cellTextSettings({hAlign: 'center'});
dataGrid.column(1)
.title('Werk')
.width(60)
.cellTextSettings({hAlign: 'left'})
.format(function () {
return this.name;
});
chart.getTimeline().horizontalScrollBar().enabled(true);
/* chart.getTimeline().periods().edit(true); */
chart.getTimeline().edit(true);
chart.getTimeline().tooltip(false);
chart.getTimeline().elements().labels(false);
chart.container("containerx");
chart.draw();
chart.fitAll();
});
},
error:function(error_data){
console.log("error")
console.log(error_data)
}});
我无法单击和移动句点(任务),也无法滚动。
非常感谢您的任何建议
请在下面找到图表的屏幕截图:
请在下面找到图表的屏幕截图:
刻度范围
您正在正确应用比例min/max:
chart.getTimeline().scale().minimum("2018-01-01");
chart.getTimeline().scale().maximum("2020-01-01");
但随后您覆盖了默认比例,它会删除 min/max 设置:
var dateTimeScale = anychart.scales.dateTime();
var dateTimeTicks = dateTimeScale.ticks();
chart.xScale(dateTimeScale);
大可不必!默认的甘特图已经是 dateTime 类型。解决方案 - 只需从您的代码中删除以上三行。
LiveEdit
您的行 chart.getTimeline().periods().edit(true);
是正确的,但由于当前版本 8.7.0(2019 年 8 月)中的一个小错误,此 setter 不适用于元素类型。为避免它用以下行替换此行 chart.getTimeline().edit(true);
.
卷轴
甘特图不支持x/yScrollers,只支持简单的滚动条。
甘特图不支持以下方法:
chart.xScroller(true);
chart.yScroller(true);
要进行缩放,您可以使用 API 功能之一。 the Gantt zooming article.
中详细描述了该主题
我正在使用 AnyGantt,但我在正确设置它时遇到了问题。
完整代码如下:
var endpoint = '/api/chart/data/'
var label = []
var start = []
var end = []
var werk = []
$.ajax({
method: 'GET',
url: endpoint,
success: function(data){
labels = data.label
start = data.start
end = data.end
uplant = data.werk
var obj = {}
var finalArray = []
for (var i = 1; i <= start.length; i++) {
var first = { id: i, name: uplant[i] }
obj = { ...obj, ...first }
var periods = { id: labels[i], start: start[i - 1], end: end[i - 1] }
if (obj.periods) {
obj.periods.push(periods)
} else {
obj.periods = [periods]
}
finalArray.push(obj)
}
anychart.onDocumentReady(function () {
var data = finalArray;
var treeData = anychart.data.tree(data, "asTable");
chart = anychart.ganttResource();
chart.data(treeData);
chart.getTimeline().scale().minimum("2018-01-01");
chart.getTimeline().scale().maximum("2020-01-01");
var dataGrid = chart.dataGrid();
dataGrid.column(0)
.title('#')
.width(30)
.cellTextSettings({hAlign: 'center'});
dataGrid.column(1)
.title('Werk')
.width(60)
.cellTextSettings({hAlign: 'left'})
.format(function () {
return this.name;
});
chart.getTimeline().horizontalScrollBar().enabled(true);
/* chart.getTimeline().periods().edit(true); */
chart.getTimeline().edit(true);
chart.getTimeline().tooltip(false);
chart.getTimeline().elements().labels(false);
chart.container("containerx");
chart.draw();
chart.fitAll();
});
},
error:function(error_data){
console.log("error")
console.log(error_data)
}});
我无法单击和移动句点(任务),也无法滚动。
非常感谢您的任何建议
请在下面找到图表的屏幕截图:
请在下面找到图表的屏幕截图:
刻度范围
您正在正确应用比例min/max:
chart.getTimeline().scale().minimum("2018-01-01");
chart.getTimeline().scale().maximum("2020-01-01");
但随后您覆盖了默认比例,它会删除 min/max 设置:
var dateTimeScale = anychart.scales.dateTime();
var dateTimeTicks = dateTimeScale.ticks();
chart.xScale(dateTimeScale);
大可不必!默认的甘特图已经是 dateTime 类型。解决方案 - 只需从您的代码中删除以上三行。
LiveEdit
您的行 chart.getTimeline().periods().edit(true);
是正确的,但由于当前版本 8.7.0(2019 年 8 月)中的一个小错误,此 setter 不适用于元素类型。为避免它用以下行替换此行 chart.getTimeline().edit(true);
.
卷轴
甘特图不支持x/yScrollers,只支持简单的滚动条。 甘特图不支持以下方法:
chart.xScroller(true);
chart.yScroller(true);
要进行缩放,您可以使用 API 功能之一。 the Gantt zooming article.
中详细描述了该主题