dx调度程序时间轴视图以当前时间指示器为中心

Question

我浏览了devExtreme文档和示例，但我找不到解决方案...

在 Razor 视图中，我正在按如下方式加载 dxScheduler(它绑定到定义"订单"和"资源"的数据库对象(：

<div id="scheduler"></div>

和

<script>
$(function () {
$("#scheduler").dxScheduler({
dataSource: orders,
views: ["timelineDay"],
currentView: "timelineDay",
showCurrentTimeIndicator: true,
shadeUntilCurrentTime: true,
firstDayOfWeek: 0,
startDayHour: 0,
endDayHour: 24,
cellDuration: 15,
groups: ["areaId"],
resources: [{
fieldExpr: "areaId",
allowMultiple: false,
dataSource: resources,
label: ""
}],
height: "100%"
})
});
</script>

它工作正常。但是，在保持单元格持续时间 = 15 分钟时：

• 我希望调度程序以当前时间指示器为中心(即表示日期时间的垂直线...
• 同时，"startDayHour"必须是"0"，"endDayHour"必须是"24"，就像现在一样。

任何建议将不胜感激。谢谢。

Answer 1

原来我只看了"配置"部分。但是也有"方法"... 答案是使用"scrollToTime"方法。

参考： https://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxScheduler/Methods/#scrollToTimehours_minutes_date。

更新了工作示例(然后设置"scrollToTime"动态的参数很简单(。

$(function () {
$("#scheduler").dxScheduler({
dataSource: orders,
views: ["timelineDay"],
currentView: "timelineDay",
showCurrentTimeIndicator: true,
shadeUntilCurrentTime: true,
firstDayOfWeek: 0,
startDayHour: 0,
endDayHour: 24,
cellDuration: 15,
groups: ["areaId"],
resources: [{
fieldExpr: "areaId",
allowMultiple: false,
dataSource: resources,
label: ""
}],
height: "100%",
onContentReady: function (e) {
e.component.scrollToTime(5, 30, new Date());
}
})
});

Answer 2

如本例所示(参见 timelineWeek 模式(

https://js.devexpress.com/Demos/WidgetsGallery/Demo/Scheduler/CurrentTimeIndicator/jQuery/Light/

需要添加：

onContentReady(e) {
e.component.scrollTo(new Date());
},