基于vue与three.js，监听FPX（Stats类使用）

2023-12-20 18:05:14

第一步，引入stats类并new出来

import Stats from 'three/examples/jsm/libs/stats.module.js';
data(){
    return {
        stats : new Stats(),
    }
}

第二步，添加dom

 mounted() {
    this.init3D();
    this.animate();
    window.addEventListener("keydown", this.toggleFullscreen, true);
    document.body.appendChild(this.stats.dom);//添加dom
    this.openFullScreen();
  },

第三步，实时更新

 animate() {
      if (!this.renderer) {
        return;
      }
      requestAnimationFrame(this.animate);
      this.controls.update(); // 更新控制器状态
      TWEEN.update();
      this.renderer.render(this.scene, this.camera);
      this.stats.update(); //更新fpx状态
      if (!this.tagRenderer) {
        return;
      }
      this.tagRenderer.render(this.scene, this.camera);
    },

文章来源:https://blog.csdn.net/m0_49083276/article/details/135112387
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。