Skip to content

T
three.js

车家大少爷 / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 7eacf2ae 编写于 作者: M Mr.doob
浏览文件
操作

* Fixed `Matrix4.makeOrtho()`. `bottom - top` -> `top - bottom` 

* Added `camera_orthographic` example.
上级 c0d14df4
展开全部 隐藏空白更改
内联 并排
Showing with 150 addition and 138 deletion
build/Three.js
浏览文件 @ 7eacf2ae
此差异已折叠。
build/ThreeDebug.js
浏览文件 @ 7eacf2ae
此差异已折叠。
examples/camera_free.html
浏览文件 @ 7eacf2ae
......@@ -56,8 +56,6 @@
<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
<script type="text/javascript" src="cameras/FreeCamera.js"></script>
<script type="text/javascript" src="geometry/primitives/Sphere.js"></script>
<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
......
examples/camera_orthographic.html 0 → 100644
浏览文件 @ 7eacf2ae
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>three.js - geometry - cube</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
<style type="text/css">
body {
font-family: Monospace;
background-color: #f0f0f0;
margin: 0px;
overflow: hidden;
}
</style>
</head>
<body>
<script type="text/javascript" src="../build/Three.js"></script>
<script type="text/javascript" src="geometry/primitives/Cube.js"></script>
<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
<script type="text/javascript" src="js/Stats.js"></script>
<script type="text/javascript">
var SCREEN_WIDTH = window.innerWidth;
var SCREEN_HEIGHT = window.innerHeight;
var container;
var stats;
var camera;
var scene;
var renderer;
var cube, plane;
var mouseX = 0;
var mouseXOnMouseDown = 0;
var windowHalfX = window.innerWidth / 2;
var windowHalfY = window.innerHeight / 2;
var moveForward = false,
moveBackwards = false,
moveUp = false,
moveDown = false,
moveLeft = false,
moveRight = false,
yawLeft = false,
yawRight = false,
pitchUp = false,
pitchDown = false,
rollLeft = false,
rollRight = false;
init();
setInterval(loop, 1000/60);
function init() {
container = document.createElement('div');
document.body.appendChild(container);
camera = new THREE.Camera( 45, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );
camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -2000, 1000 );
camera.position.x = 100;
camera.position.y = 100;
camera.position.z = 100;
scene = new THREE.Scene();
// Plane
plane = new THREE.Mesh( new Plane( 1000, 1000, 20, 20 ), new THREE.MeshColorStrokeMaterial( 0x000000, 0.2 ) );
plane.rotation.x = - 90 * ( Math.PI / 180 );
scene.addObject( plane );
geometry = new Cube( 40, 40, 40 );
for (var i = 0; i < 100; i ++ ) {
cube = new THREE.Mesh(geometry, new THREE.MeshColorFillMaterial( 0xffffff ) );
cube.overdraw = true;
cube.scale.y = Math.random() * 2 + 1;
cube.position.x = Math.random() * 1000 - 500;
cube.position.y = ( cube.scale.y * 40 ) / 2;
cube.position.z = Math.random() * 1000 - 500;
scene.addObject(cube);
}
// Lights
var ambientLight = new THREE.AmbientLight( Math.random() * 0x10 );
scene.addLight( ambientLight );
var directionalLight = new THREE.DirectionalLight( Math.random() * 0xffffff );
directionalLight.position.x = Math.random() - 0.5;
directionalLight.position.y = Math.random() - 0.5;
directionalLight.position.z = Math.random() - 0.5;
directionalLight.position.normalize();
scene.addLight( directionalLight );
var directionalLight = new THREE.DirectionalLight( Math.random() * 0xffffff );
directionalLight.position.x = Math.random() - 0.5;
directionalLight.position.y = Math.random() - 0.5;
directionalLight.position.z = Math.random() - 0.5;
directionalLight.position.normalize();
scene.addLight( directionalLight );
renderer = new THREE.CanvasRenderer();
renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
container.appendChild( renderer.domElement );
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.top = '0px';
container.appendChild(stats.domElement);
}
//
function loop() {
var timer = new Date().getTime() * 0.0001;
camera.position.x = Math.cos( timer ) * 200;
camera.position.z = Math.sin( timer ) * 200;
renderer.render(scene, camera);
stats.update();
}
</script>
</body>
</html>
examples/cameras/FreeCamera.js 已删除 100644 → 0
浏览文件 @ c0d14df4
/**
* @author mr.doob / http://mrdoob.com/
*/
THREE.FreeCamera = function ( x, y, z ) {
THREE.Camera.call( this, x, y, z );
this.rotation = new THREE.Vector3( 0, 0, 0 );
this.moveZ = function ( amount ) {
direction.set( this.matrix.n11, this.target.position, this.position );
depth = direction.length();
direction.normalize();
vector.copy( direction );
vector.multiplyScalar( amount );
direction.multiplyScalar( depth );
this.position.addSelf( vector );
this.target.position.add( this.position, direction );
};
this.updateMatrix = function () {
this.matrix.identity();
this.matrix.multiplySelf( THREE.Matrix4.translationMatrix( this.position.x, this.position.y, this.position.z ) );
this.matrix.multiplySelf( THREE.Matrix4.rotationXMatrix( this.rotation.x ) );
this.matrix.multiplySelf( THREE.Matrix4.rotationYMatrix( this.rotation.y ) );
this.matrix.multiplySelf( THREE.Matrix4.rotationZMatrix( this.rotation.z ) );
};
/*
var depth = 0;
var vector = new THREE.Vector3();
var direction = new THREE.Vector3();
this.moveX = function ( amount ) {
direction.sub( this.target.position, this.position );
depth = direction.length();
direction.normalize();
vector.copy( this.up );
vector.crossSelf( direction );
vector.multiplyScalar( amount );
direction.multiplyScalar( depth );
this.position.subSelf( vector );
this.target.position.add( this.position, direction );
};
this.moveZ = function ( amount ) {
direction.sub( this.target.position, this.position );
depth = direction.length();
direction.normalize();
vector.copy( direction );
vector.multiplyScalar( amount );
direction.multiplyScalar( depth );
this.position.addSelf( vector );
this.target.position.add( this.position, direction );
};
this.rotateX = function( amount ) { // pitch
amount *= Math.PI / 180;
vector.x = direction.x;
vector.y = ( direction.y * Math.cos( amount ) ) - ( direction.z * Math.sin( amount ) );
vector.z = ( direction.y * Math.sin( amount ) ) + ( direction.z * Math.cos( amount ) );
direction.copy( vector );
vector.set( direction.x, direction.y, direction.z );
vector.multiplyScalar( 400 );
this.target.position.copy( this.position );
this.target.position.addSelf( vector );
};
this.rotateY = function( amount ) { // yaw
amount *= Math.PI / 180;
direction.sub( this.position, this.target.position );
depth = direction.length();
direction.normalize();
vector.x = ( direction.z * Math.sin( amount ) ) + ( direction.x * Math.cos( amount ) );
vector.y = direction.y;
vector.z = ( direction.z * Math.cos( amount ) ) - ( direction.x * Math.sin( amount ) );
direction.copy( vector );
direction.multiplyScalar( depth );
this.target.position.sub( this.position, direction );
};
this.rotateZ = function( amount ) { // roll
amount *= Math.PI / 180;
vector.x = ( this.up.x * Math.cos( amount ) ) - ( this.up.y * Math.sin( amount ) );
vector.y = ( this.up.x * Math.sin( amount ) ) + ( this.up.y * Math.cos( amount ) );
vector.z = this.up.z;
this.up.copy( vector );
};
*/
};
THREE.FreeCamera.prototype = new THREE.Camera();
THREE.FreeCamera.prototype.constructor = THREE.FreeCamera;
src/core/Matrix4.js
浏览文件 @ 7eacf2ae
......@@ -435,7 +435,7 @@ THREE.Matrix4.makeOrtho = function( left, right, top, bottom, near, far ) {
m = new THREE.Matrix4();
w = right - left;
h = bottom - top;
h = top - bottom; // - top;
p = far - near;
x = ( right + left ) / w;
y = ( bottom + top ) / h;
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或