1.7 Three.js
kingov
生活嘛, 最重要的是有希望 !
展开
-
THREE.js为正方体的6个面贴上图片
效果图 代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Co原创 2017-08-15 16:44:11 · 13608 阅读 · 0 评论 -
常用代码
创建一个基本的threejs应用<!DOCTYPE html><html lang="en"> <head> <title>路径相机</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no, minim原创 2017-09-07 23:44:29 · 336 阅读 · 0 评论 -
THREE.Euler()欧拉角
1 THREE.Euler 用法 THREE.Euler( a , b , c , ‘xyz’ ); 表示将一个几何体绕x轴旋转a度,绕y轴旋转b度,绕z轴旋转c度;并且旋转的顺序是xyz ; 第三个参数旋转顺序可以是’XYZ’, ‘YZX’, ‘ZXY’, ‘XZY’, ‘YXZ’, ‘ZYX’THREE.Euler = function ( x, y, z, order ) {原创 2017-09-07 23:36:39 · 4884 阅读 · 0 评论 -
矩阵旋转
矩阵的概念threejs中的矩阵矩阵的应用用于旋转一个几何体创建一个立方体cube放到场景中;绕向量(1,1,0)旋转30度var axis = new THREE.Vector3(1,1,0); //创建一个三维向量var rotWorldMatrix = new THREE.Matrix4(); //创建一个4*4矩阵rotWorldMatrix.makeRotationAx原创 2017-09-09 11:39:27 · 991 阅读 · 1 评论 -
threeJS中4*4矩阵实现平移和旋转的原理
1.坐标系我们可以通过建立2D或3D笛卡尔坐标系来确定物体的位置,然而在3D图形处理中我们会用到多种坐标系,这在特定的场合下是非常有用的。也就是说,使用它们可心简化我们开发图形程序的难度,而且它们还可以相互转换,从而使得构造3D世界里物体模型非常容易,下面我们就简单介经一下几个常用的坐标系。(1)世界坐标系世界坐标系是一个特殊的坐标系,它建立了描述其他坐标系所需要的的参考框架。从非技术意义上讲,世界原创 2017-08-20 18:48:40 · 13756 阅读 · 7 评论 -
坐标系统
坐标系统坐标转换平常WebGL渲染的时候,如果顺过来看的话,坐标转换会经过如下几个过程 局部坐标=>世界坐标=>观察坐标=>裁剪坐标=>标准设备坐标=>屏幕坐标 就是我们平常说的MVP矩阵,如果哪天需要知道“当前鼠标点击的那个点,对应的三维坐标是多少干怎么办呢?”也就是说当前屏幕坐标所对应的世界坐标是多少? 这里我们需要将这个过程反过来: ...原创 2017-08-13 17:36:42 · 491 阅读 · 1 评论 -
计算机图形学知识点
1 什么是计算机图形学数学算法将二维或三维图形转化为计算机显示器的栅格形式的科学。简单地说,计算机图形学的主要研究内容就是研究如何在计算机中表示图形、以及利用计算机进行图形的计算、处理和显示的相关原理与算法。虽然通常认为CG是指三维图形的处理,事实上也包括了二维图形及图像的处理。 计算机图形学主要包含四大部分的内容:建模(Modeling)、渲染(Rendering)、动画(Animatio...原创 2017-08-13 14:28:15 · 1491 阅读 · 0 评论 -
mark
renderer.domElement渲染到canvas中this.rightModel.renderer.render( this.rightModel.scene , this.rightModel.camera );this.ctx.drawImage( this.rightModel.renderer.domElement , -29 , -6 , 320 , 325 ); ...原创 2018-03-11 00:40:02 · 171 阅读 · 0 评论 -
threejs材质
文章目录材质的基础属性融合属性高级属性定义属性MeshBasicMaterial (网格基础材质)为每个面添加一个坐标指向法向量材质应用到对应面MeshDepthMaterial联合材质MeshLambertMaterial (可以对光源做出反应)MeshPhongMaterial (可以对光源, 高亮做出反应)LineBasicMaterialLineDashedMaterial材质的基础属性...原创 2019-02-22 13:42:23 · 1308 阅读 · 3 评论