zs_aucma-mes-ui/src/views/model/model.vue

<template>
  <div class="app-container">
    <div id="container" class="container"></div>
  </div>
</template>

<script>

const isAMRT = () => {
  return new Promise((resolve, reject) => {
    const fun = () => {
      if (typeof AMRT !== "undefined" && AMRT) {
        resolve(true)
      } else {
        setTimeout(fun, 100)
      }
    }
    fun()
  })
}

export default {
  name: "Model",
  data() {
    return {
      viewer: null
    }
  },
  async mounted() {
    await isAMRT()
    console.log(AMRT)
    const param = {
      appkey: 'aveMPyNWzDJm',
      appsecret: 'rXmhoLAiOPNKzbl7g2qxCV8tFwRdYuZM'
    }
    const viewer = new AMRT.Viewer('container', param)
    let num = 0
    let modelArr = [
      '1720315475507941376',
      '1720315479907766272',
      '1720315484513112064',
      '1720315500866703360',
      '1720315558030872576',
      '1720315596551360512',
      '1720315644550975488',
      '1720315648946606080',
      '1720315687114772480',
      '1720315691422322688',
      '1720315722275622912',
      '1720315729129115648',
      '1720315768454909952',
      '1720316275214913536',
      '1720316297822212096',
    ]
    modelArr.forEach(e=>{
      viewer.loadModel(e, {
        background: false,
        onLoad: function (m) {
          num+=1
          if(num === modelArr.length){
            alert('加载完成');
          }
          m.on('click', ()=>{alert(`${e}`)})
        }
      })
    })
    viewer.controls.startAutoRotate(1)
  },
  methods: {}
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0
}

.container {
  width: 100vw;
  height: 100vh
}

</style>