29 Sept 2021, 08:32

I use camera-unproject to do coordinate mapping, but the obtained coordinates are obviously wrong.

code:

    const regl = this.$el
    const handleMouseDown = (e) => {
      const x = 1 - (e.offsetX / regl.clientWidth) * 2
      const y = (e.offsetY / regl.clientHeight) * 2 - 1

      const point = vec3.fromValues(x, y, 0.5)

      const { projection, view, viewport } = this.camera

      const combinedProjView = mat4.multiply([], projection, view)

      const invProjView = mat4.invert([], combinedProjView)

      const result = unproject([], point, viewport, invProjView)

      console.log('convasSize: ', [regl.clientWidth, regl.clientHeight])
      console.log('viewport: ', viewport)
      console.log('clickPoint: ', [x, y])
      console.log('unproject result:', result)
    }
    this.$el.addEventListener('mousedown', handleMouseDown.bind(this))

4a0979ad-ef8d-4af6-80d6-b7a52f92e8f9-image.png
Could it be that I did something wrong?