修改鼠标滚轮的行为
鼠标滚轮的行为支持放大缩小画布和上下移动画布,可以在实例化时通过配置指定:
js
new MindMap({
// ...
mousewheelAction: 'move'// zoom(放大缩小)、move(上下移动)
// 当mousewheelAction设为move时,可以通过该属性控制鼠标滚动一下视图移动的步长,单位px
mousewheelMoveStep: 100,
// 鼠标缩放是否以鼠标当前位置为中心点,否则以画布中心点
mouseScaleCenterUseMousePosition: true,
// 当mousewheelAction设为zoom时,或者按住Ctrl键时,默认向前滚动是缩小,向后滚动是放大,如果该属性设为true,那么会反过来
mousewheelZoomActionReverse: true,
// 禁止鼠标滚轮缩放,你仍旧可以使用api进行缩放
disableMouseWheelZoom: false,
})
如果需要动态的切换行为可以使用updateConfig
方法:
js
mindMap.updateConfig({
mousewheelAction: 'zoom'
})
此外也支持让你自行处理鼠标滚轮事件:
js
new MindMap({
// ...
customHandleMousewheel: (e) => {
// 你的自定义逻辑
}
})
当传了customHandleMousewheel
选项,mousewheelAction
选项将不生效。