threecanvas实现3d三维立方体像素堆积木建造效果代码-html代码-BFW代码库

threecanvas实现3d三维立方体像素堆积木建造效果代码

代码语言：html

所属分类：三维

代码描述：threecanvas实现3d三维立方体像素堆积木建造效果代码，点击就可以增加立方体。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE HTML>
<html lang="en">

<head>

    <meta charset="utf-8">
    <style type="text/css">
        body {
        				font-family: Monospace;
        				font-size: 12px;
        				background-color: #f0f0f0;
        				margin: 0px;
        				overflow: hidden;
        			}
    </style>
</head>

<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ThreeCanvas.28.js"></script>
    <script type="text/javascript">
        /**
     * @author mr.doob / http://mrdoob.com/
     */
    
    var Cube = function (width, height, depth) {
    
    	THREE.Geometry.call(this);
    
    	var scope = this,
    	width_half = width / 2,
    	height_half = height / 2,
    	depth_half = depth / 2;
    
    	v(  width_half,  height_half, -depth_half );
    	v(  width_half, -height_half, -depth_half );
    	v( -width_half, -height_half, -depth_half );
    	v( -width_half,  height_half, -depth_half );
    	v(  width_half,  height_half,  depth_half );
    	v(  width_half, -height_half,  depth_half );
    	v( -width_half, -height_half,  depth_half );
    	v( -width_half,  height_half,  depth_half );
    
    	f4( 0, 1, 2, 3 );
    	f4( 4, 7, 6, 5 );
    	f4( 0, 4, 5, 1 );
    	f4( 1, 5, 6, 2 );
    	f4( 2, 6, 7, 3 );
    	f4( 4, 0, 3, 7 );
    
    	function v(x, y, z) {
    
    		scope.vertices.push( new THREE.Vertex( new THREE.Vector3( x, y, z ) ) );
    	}
    
    	function f4(a, b, c, d) {
    
    		scope.faces.push( new THREE.Face4( a, b, c, d ) );
    	}
    
    	this.computeCentroids();
    	this.computeNormals();
    
    }
    
    Cube.prototype = new THREE.Geometry();
    Cube.prototype.constructor =.........完整代码请登录后点击上方下载按钮下载查看