matter.jsのマウスドラッグ機能を機能させないようにしたい

Question

matter.jsを使って物理演算のテストをしています。
worldに四角いBodiesを追加し、それをクリックしたら、Bodiesのlabelをみて、ログを出すようにしています。
やりたいこととしては、

##ドラッグ機能を機能させないこと
##スクロール機能を機能させること

です。

Events.on(---, "mousedown", (e) => {}

マウスダウンにすると、Bodiesのラベルを参照することはできません。
Bodiesを参照できるのはstartdragだけのようです…
ご教示のほど、よろしくお願いします。。

  module() {
    const Engine = Matter.Engine;
    const Render = Matter.Render;
    const Runner = Matter.Runner;
    const Body = Matter.Body;
    const World = Matter.World;
    const Bodies = Matter.Bodies;
    const Common = Matter.Common;
    const Events = Matter.Events;
    const Mouse = Matter.Mouse;
    const MouseConstraint = Matter.MouseConstraint;
    const engine = Engine.create();
    const world = engine.world;
    const runner = Runner.create();
    const render = Render.create({
      element: this.element,
      canvas: this.view,
      engine: engine,
      options: {
        width: this.canvasWidth,
        height: this.canvasHeight,
        pixelRation: 1,
        background: '#000000',
        hasBouse: false,
        wireframes: true
      }
    });

    Render.run(render);
    Runner.run(runner, engine);
    engine.world.gravity.y = 2; //重力を0に設定 デフォルトは1

    //落ちてくる要素
    const facebook = Bodies.rectangle(this.canvasWidth / 2, 200, 200, 200, {
      chamfer: {
        radius: 5 //角丸
      },
      density: 5,
      frictionAir: 0.001, //空気抵抗
      restitution: 0.3, //    弾力性
      friction: 8, // 摩擦
      label: 'facebook',
      angle: Math.random() * 10,
 
    });
    World.add(world, facebook);

    var startdrag = MouseConstraint.create(engine, {
      element: this.element, 
    });
    World.add(world, startdrag);


    Events.on(startdrag, "startdrag", (e) => {
      console.log(e);
      if(e.body.label == "facebook") {
        console.log('俺がfacebookだ');
      }
    });
    //壁
    const wall = [
      Bodies.rectangle(this.canvasWidth / 2, -25, this.canvasWidth, 50, {isStatic: true}),
      Bodies.rectangle(this.canvasWidth / 2, this.canvasHeight + 25, this.canvasWidth, 50, {isStatic: true}),
      Bodies.rectangle(-25, this.canvasHeight / 2, 50, this.canvasHeight, {isStatic: true}),
      Bodies.rectangle(this.canvasWidth + 25, this.canvasHeight / 2, 50, this.canvasHeight, {isStatic: true})
    ];
    World.add(world, wall);

    Render.lookAt(render, {
      min: {
        x: 0,
        y: 0
      },
      max: {
        x: this.canvasWidth,
        y: this.canvasHeight
      }
    });

    return {
      engine: engine,
      runner: runner,
      render: render,
      canvas: this.view,
      stop: function() {
        Matter.Render.stop(render);
        Matter.Runner.stop(runner);
      }
    }
  }
};

Answer 1

const mouse = Mouse.create(this.element);
this.element.addEventListener('click', () => {
const query = Query.point(Composite.allBodies(world), mouse.position)
console.log(mouse.position);
console.log(query);
});