页面上的缩放处理程序（带/不带触摸板）

Question

目标：处理用户的放大/缩小（并需要处理一些逻辑）。我正在处理wheel事件，用鼠标可以正常工作。但！在Mac上具有触摸栏事件的情况下，还可以同时产生缩放移动和滚动移动（是的，我知道这是合理的）

问题：这些事件如何分开？或针对此类情况的任何好的方法？

我有下一个代码：

var val = 1000;

var draw = () => output.innerHTML = val;

draw();

document.body.addEventListener('wheel', (ev) => {
  val = val + ev.deltaY;
  // disabled for SO sandbox
  // console.log('wheel', ev);
  draw();
})

document.body.addEventListener('scroll', (ev) => {
  // console.log('scroll', ev);
})

#output {
  border: 1px solid red;
  width: 300px;
  height: 300px;
  line-height: 300px;
  text-align: center;
}

  <div id="output">
    
    
  </div>

https://jsbin.com/zopujawoze/edit?html,css,js,output