base.css

站在用戶的角度思考問題，與客戶深入溝通，找到蒼南網站設計與蒼南網站推廣的解決方案，憑借多年的經驗，讓設計與互聯網技術結合，創(chuàng)造個性化、用戶體驗好的作品，建站類型包括：成都網站建設、成都做網站、企業(yè)官網、英文網站、手機端網站、網站推廣、域名注冊、網頁空間、企業(yè)郵箱。業(yè)務覆蓋蒼南地區(qū)。

html,body{
    position:relative;
    height:100%;
}
body { margin: 0; }
canvas { width: 100%; height: 100% }
ul{
    padding:0;
    margin:0;
    list-style: none;
}

*{box-sizing: border-box;}

box_outline.js

var scene = new THREE.Scene();
scene.background = new THREE.Color( 0xaaaaaa );
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

// 實線
var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
var edges = new THREE.EdgesGeometry( geometry );
var line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { 
    color: 0xffffff,
    linewidth: 5,
    linejoin:  'bevel',
    linecap: 'square',
}));
scene.add( line );

// 虛線
var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
var edges = new THREE.EdgesGeometry( geometry );
var line = new THREE.LineSegments( edges, new THREE.LineDashedMaterial( { color: 0xffffff,dashSize: 0.1, gapSize: 0.1,linewidth: 1} ));
line.computeLineDistances(); // 非常重要 不然出不來效果
line.position.y = 2;
scene.add( line );


camera.position.z = 5;

function animate() {
    requestAnimationFrame( animate );
    renderer.render( scene, camera );
}
animate();

box_outline.html

另外有需要云服務器可以了解下創(chuàng)新互聯scvps.cn，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

標題名稱：threejs繪制一個盒子的實現和虛線-創(chuàng)新互聯
當前網址：http://weahome.cn/article/gpcij.html