implement zooming to center date using zoomToLevel function which supports extra params including center date. You check sources to see how TimelineZoomable.onWheel works.
increase preventScrollZoom timeout to get more control over the scroll speed
You can check the following code in Scheduler Basic demo:
import EventHelper from '../../lib/Core/helper/EventHelper.js';
....
const scheduler = new Scheduler({
zoomOnMouseWheel : false,
listeners : {
paint() {
EventHelper.on({
element : this.timeAxisSubGridElement,
wheel : 'onMouseWheelHandler',
// Throttle zooming with the wheel a bit to have greater control of it
throttled : {
buffer : 100,
// Prevent events from slipping through the throttle, causing scroll
alt(event) {
if (event.ctrlKey) {
event.preventDefault();
}
}
},
thisObj : this,
capture : true,
passive : false
});
}
},
onMouseWheelHandler(event) {
const me = this;
if (event.ctrlKey) {
event.preventDefault();
if (!me.preventScrollZoom) {
const currentZoomLevelIndex = this.zoomLevel;
const centerDate = me.getDateFromDomEvent(event);
let level;
if (event.deltaY > 0 && currentZoomLevelIndex > this.minZoomLevel) {
level = currentZoomLevelIndex - 1;
}
else if (event.deltaY < 0 && currentZoomLevelIndex < this.maxZoomLevel) {
level = currentZoomLevelIndex + 1;
}
console.log(level);
if (level != null) {
me.zoomToLevel(level, { centerDate });
me.preventScrollZoom = true;
me.setTimeout(() => me.preventScrollZoom = false, 500);
}
}
}
},