用法一:

var stats = new Stats();
stats.setMode(0);
stats.domElement.style.position = 'absolute';
stats.domElement.style.left = '0px';
stats.domElement.style.top = '0px';
document.body.appendChild(stats.domElement);
setInterval(function () {
    stats.begin();
    stats.end();
}, 1000 / 60)

用法二(红字部分):

var renderer;
var stats = new Stats();
function initThree() {
    stats.setMode(0);
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.left = '0px';
    stats.domElement.style.top = '0px';
    document.body.appendChild(stats.domElement);
    renderer = new THREE.WebGLRenderer({
        canvas: canvas,
        antialias: true
    });
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setClearColor(0xffffff, 1.0);
}......此处代码省略......
function animation3D() {    cylinder.position.x -= 0.5;    renderer.render(scene, camera);    requestAnimationFrame(animation3D);    stats.update();}
requestAnimationFrame(animation3D);

three.js学习:性能监视器stats.js的用法的更多相关文章

  1. three.js之性能监视器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. WebGL three.js学习笔记 创建three.js代码的基本框架

    WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的 ...

  3. three.js学习:初学three.js,从立方体开始

    目前three.js是浏览器展现3D效果的一个很强大的js工具,遗憾的是没有特别系统而全面的文档(threejs官方文档感觉有些缺漏,可以和WebGL中文网的threejs教程对比着看).好了,根据W ...

  4. Sea.js学习1——初识Sea.js

    Sea.js 是一个成熟的开源项目,核心目标是给前端开发提供简单.极致的模块化开发体验. 使用 Sea.js,在书写文件时,需要遵守 CMD (Common Module Definition)模块定 ...

  5. Node.js学习笔记(1) - Node.js简介

    近期在看一些Node.js的知识,看完后觉得,一些前面的东西忘记了,于是整理一下,方便自己查阅,也希望对学习Node.js的朋友有些帮助: 当然以下只是我个人的观点和理解,不喜勿喷,也望大神指教. 一 ...

  6. js学习之道:js防止表单重复提交

    第一种:用flag标识,下面的代码设置checkSubmitFlg标志: <script language="”javascript”"> var checkSubmi ...

  7. js学习(六)- js对象创建

    //---------------------js文件--------------------- var namespace02=new Object(); namespace02.Person=fu ...

  8. Node.js学习笔记(2) - Node.js安装及入门hello world

    今天来简单的记录一下Node.js的安装配置以及简单的入门 一.Node.js的安装 1.windows下的安装 windows下的安装很简单,只需要去官网http://nodejs.org中,找到w ...

  9. JS学习笔记(模态框JS传参)

    博主最近基于django框架的平台第一版差不多完成了 今天整理下开发过程中遇到的前端知识 基于前端bootstrap框架模态框传参问题 上前端html代码: <div class="m ...

随机推荐

  1. LOJ 2743(洛谷 4365) 「九省联考 2018」秘密袭击——整体DP+插值思想

    题目:https://loj.ac/problem/2473 https://www.luogu.org/problemnew/show/P4365 参考:https://blog.csdn.net/ ...

  2. Zookeeper 重连机制

    Zookeeper 重连机制 public class ZKConnectSessionWatcher implements Watcher { public final static String ...

  3. 学习大数据基础框架hadoop需要什么基础

    什么是大数据?进入本世纪以来,尤其是2010年之后,随着互联网特别是移动互联网的发展,数据的增长呈爆炸趋势,已经很难估计全世界的电子设备中存储的数据到底有多少,描述数据系统的数据量的计量单位从MB(1 ...

  4. java中Future与FutureTask使用与分析

    Future与FutureTask都是用于获取线程执行的返回结果.下面我们就对两者之间的关系与使用进行一个大致的介绍与分析 一.Future与FutureTask介绍: Future位于java.ut ...

  5. spring boot 热更新配置

    maven添加 spring-boot-devtools 允许自动构建 设置里面,搜索compiler,在Build,Execution,Deployment里面勾选Build project aut ...

  6. JavaScript压缩代码解压缩还原具体办法

    我们知道许多网站都对Javascript代码进行了压缩,但这对开发者和学习者来说,读起来很费劲,本文分享给大家在Chrome浏览器中,如何使用Pretty Print功能反压缩JS代码,让代码更加直观 ...

  7. Tomcat实战-调优方案

    Tomcat的默认配置,性能并不是最优的,可以通过优化tomcat以此来提高网站的并发能力.提高Tomcat的性能可以分为两个方向. 服务器资源 服务器所能提供CPU.内存.硬盘的性能对处理能力有决定 ...

  8. 分布式消息队列RocketMQ--事务消息--解决分布式事务

    说到分布式事务,就会谈到那个经典的”账号转账”问题:2个账号,分布处于2个不同的DB,或者说2个不同的子系统里面,A要扣钱,B要加钱,如何保证原子性? 一般的思路都是通过消息中间件来实现“最终一致性” ...

  9. WPF系列学习

    1:WPF最小化到系统托盘 2:WPF程序单例运行 3:WPF中三种异常捕获:UI线程异常.非UI线程异常.Task线程异常 在窗体放一个按钮在单击事件执行如下代码来模拟. private void ...

  10. Windows系统下安装zip命令

    从GnuWin32 项目页面 上下载并安装 zip 命令 添加环境变量到系统中,即将安装目录添加至你的系统的 Path环境变量中( 假设安装目录时D:\Program Files (x86)\GnuW ...