three.js
渣渣前端
公众号:小码农的成长之路
展开
-
three.js+vue小案例
首先要下载mtl-obj-loader,然后再下载一个three-controls即可<template> <div class="hello" ref="box"> </div></template><script>import * as THREE from 'three/src/Three'import {MTLLoader, OBJLoader} from 'mtl-obj-loader'import {Orb原创 2020-07-05 09:05:45 · 1480 阅读 · 0 评论 -
three.js变形动画
three.js的几何体提供了morphTargets属性,可以通过改变morphTargetInfluences属性形成动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D原创 2020-05-19 23:32:39 · 1144 阅读 · 0 评论 -
three.js自定义几何体
three.js提供了很多创建几何体对象的方法,如BoxGeometry,SphereGeometry等,当然也可以自己创建几何体如下面这段代码var gemo=new THREE.Geometry()//定义几何体的顶点var vertices=[new THREE.Vector3(0,0,0),new THREE.Vector3(0,0,6),new THREE.Vector3(7,...原创 2019-12-12 08:36:06 · 1943 阅读 · 0 评论 -
three.js光源
①基本光源THREE.AmbientLight属性为color使用此光源时,此光源的颜色将会应用到全局,即场景中的所有物体都有这种光源的颜色,通常不能将它作为唯一光源,它不会生成阴影②点光源THREE.PointLight属性有color,distance,intensity,position,visible单点发光,用于照射所有方向,不会生成阴影。color定义颜色,dis...原创 2019-12-17 15:53:24 · 346 阅读 · 0 评论 -
three.js学习笔记MorphAnimMesh
three,js提供了创建动画的网格MorphAnimMesh,有了它模型就可以动起来<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initi...原创 2020-02-15 10:45:57 · 402 阅读 · 0 评论 -
three.js小案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l...原创 2020-02-24 09:22:04 · 564 阅读 · 0 评论 -
three.js改变几何体颜色
效果如图点击几何体的其中一个面改变这个面的颜色<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...原创 2020-03-27 09:28:41 · 8324 阅读 · 0 评论