JavaScript
Live2D
cubism3

CubismJsComponents(Cubism 3 SDK)でメッシュのクリック検出

動機

CubismJsComponentsでSDK 2.1のhitTest()みたいなことをしたかった。

結論

containsPoint()を使う。

クリック座標が特定のメッシュ上かどうか

appはPIXI.Application(), modelはPIXI.modelBuilder()で読み込んだもの。

const meshName = {クリックを検出したいメッシュ名}

app.view.addEventListener('click',(e)=>{
  const clickPoint = new PIXI.Point(e.clientX, e.clientY)
  if(model.getModelMeshById(meshName).containsPoint(ClickPoint)){
    console.log("メッシュ上にある!")
  } else {
    console.log("メッシュ上にない!")
  }
})

もっといい方法があれば教えてくださいm(_ _)m