PIXI.JS 点击获取当前坐标

PIXI Canvas 点击事件如下
​

   onMounted(() => {
      console.log('mounted')

      app.renderer.plugins.interaction.on('pointerdown', (event: PIXI.InteractionEvent) => {
        let ax = event.data.getLocalPosition(container)
        console.log(ax)
      })

    })

通过监听pointerdown事件获取点击时的PIXI Event
​

可以获取相关的信息，其中有一个Global.Point 这个坐标是相对的，根据不同的页面大小会显示不同的坐标，并非真是坐标，需要对其加以转换
​

根据文档https://pixijs.io/examples/#/interaction/dragging.js 可知，有getLocalPosition相关API
​

InteractionData.getLocalPosition<PIXI.Point>(displayObject: PIXI.DisplayObject, point?: PIXI.Point | undefined, globalPos?: PIXI.IPointData | undefined): PIXI.Point

getLocalPositio（） 方法需要有对应的DisplayObject
​

若画布中有Graphics、Sprite 或其他类型的DisplayObject 则直接引用即可
​

如无特殊DisplayObject 可以添加一个PIXI.Container 作为容器

    const container = new PIXI.Container()

    app.stage.addChild(container)

PIXI .DisplayObject

在屏幕上呈现的所有对象的基类。
​

Display objects implemented in PixiJS

​