Skip to content

T
three.js

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

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

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

提交 51380d20 编写于 作者: A Adam Leeper
浏览文件
操作

style changes: whitespace to tabs, and camelCase

上级 2a90d9d2
隐藏空白更改
内联 并排
Showing with 132 addition and 134 deletion
examples/js/loaders/STLLoader.js
浏览文件 @ 51380d20
......@@ -7,8 +7,8 @@
* Supports both binary and ASCII encoded files, with automatic detection of type.
*
* Limitations: Binary decoding ignores header. There doesn't seem to be much of a use for it.
* There is perhaps some question as to how valid it is to always assume little-endian-ness.
* ASCII decoding assumes file is UTF-8. Seems to work for the examples...
* There is perhaps some question as to how valid it is to always assume little-endian-ness.
* ASCII decoding assumes file is UTF-8. Seems to work for the examples...
*
* Usage:
* var loader = new THREE.STLLoader();
......@@ -61,47 +61,44 @@ THREE.STLLoader.prototype = {
}, false );
request.open( 'GET', url, true );
request.responseType = "arraybuffer";
request.responseType = "arraybuffer";
request.send( null );
},
bin2str: function (buf) {
bin2str: function (buf) {
var array_buffer = new Uint8Array(buf);
var str = '';
for(var i = 0; i < buf.byteLength; i++) {
str += String.fromCharCode(array_buffer[i]); // implicitly assumes little-endian
}
return str
var array_buffer = new Uint8Array(buf);
var str = '';
for(var i = 0; i < buf.byteLength; i++) {
str += String.fromCharCode(array_buffer[i]); // implicitly assumes little-endian
}
return str
},
},
isASCII: function(buf){
isASCII: function(buf){
var dv = new DataView(buf);
var str = '';
for(var i = 0; i < 5; i++) {
str += String.fromCharCode(dv.getUint8(i, true)); // assume little-endian
}
return (str.toLowerCase() == 'solid'); // All ASCII stl files begin with 'solid'
var dv = new DataView(buf);
var str = '';
for(var i = 0; i < 5; i++) {
str += String.fromCharCode(dv.getUint8(i, true)); // assume little-endian
}
return (str.toLowerCase() === 'solid'); // All ASCII stl files begin with 'solid'
},
parse: function (buf) {
parse: function (buf) {
if( this.isASCII(buf) )
{
var str = this.bin2str(buf);
console.log("Detected ASCII stl file.");
return this.parseASCII(str);
}
else
{
console.log("Detected Binary stl file.");
return this.parseBinary(buf);
}
if( this.isASCII(buf) )
{
var str = this.bin2str(buf);
return this.parseASCII(str);
}
else
{
return this.parseBinary(buf);
}
},
......@@ -146,51 +143,53 @@ THREE.STLLoader.prototype = {
},
parseBinary: function (buf) {
parseBinary: function (buf) {
// STL binary format specification, as per http://en.wikipedia.org/wiki/STL_(file_format)
//
// UINT8[80] – Header
// UINT32 – Number of triangles
//
// foreach triangle
// REAL32[3] – Normal vector
// REAL32[3] – Vertex 1
// REAL32[3] – Vertex 2
// REAL32[3] – Vertex 3
// UINT16 – Attribute byte count
// end
//
// STL binary format specification, as per http://en.wikipedia.org/wiki/STL_(file_format)
//
// UINT8[80] – Header
// UINT32 – Number of triangles
//
// foreach triangle
// REAL32[3] – Normal vector
// REAL32[3] – Vertex 1
// REAL32[3] – Vertex 2
// REAL32[3] – Vertex 3
// UINT16 – Attribute byte count
// end
//
var geometry = new THREE.Geometry();
var geometry = new THREE.Geometry();
var headerLength = 80;
var dataOffset = 84;
var faceLength = 12*4 + 2;
var header_length = 80;
var data_offset = 84;
var face_length = 12*4 + 2;
var le = true; // is little-endian // This might be processor dependent...
var header = new Uint8Array(buf, 0, header_length);
var num_triangles = new Uint32Array(buf, header_length, 1);
// var header = new Uint8Array(buf, 0, headerLength); // not presently used
var dvTriangleCount = new DataView(buf, headerLength, 4);
var numTriangles = dvTriangleCount.getUint32(0, le);
var le = true; // is little-endian? // This might be processor dependent...
for (var i = 0; i < num_triangles[0]; i++) {
for (var i = 0; i < numTriangles; i++) {
var dv = new DataView(buf, data_offset + i*face_length, face_length);
var dv = new DataView(buf, dataOffset + i*faceLength, faceLength);
var normal = new THREE.Vector3( dv.getFloat32(0, le), dv.getFloat32(4, le), dv.getFloat32(8, le) );
var normal = new THREE.Vector3( dv.getFloat32(0, le), dv.getFloat32(4, le), dv.getFloat32(8, le) );
for(var v = 3; v < 12; v+=3) {
for(var v = 3; v < 12; v+=3) {
geometry.vertices.push( new THREE.Vector3( dv.getFloat32(v*4, le), dv.getFloat32((v+1)*4, le), dv.getFloat32( (v+2)*4, le ) ) );
geometry.vertices.push( new THREE.Vector3( dv.getFloat32(v*4, le), dv.getFloat32((v+1)*4, le), dv.getFloat32( (v+2)*4, le ) ) );
}
var len = geometry.vertices.length;
geometry.faces.push( new THREE.Face3( len - 3, len - 2, len - 1, normal ) );
}
}
var len = geometry.vertices.length;
geometry.faces.push( new THREE.Face3( len - 3, len - 2, len - 1, normal ) );
}
geometry.computeCentroids();
geometry.computeBoundingSphere();
geometry.computeCentroids();
geometry.computeBoundingSphere();
return geometry;
}
return geometry;
}
};
examples/webgl_loader_stl.html
浏览文件 @ 51380d20
......@@ -24,33 +24,33 @@
}
a { color: skyblue }
.button { background:#999; color:#eee; padding:0.2em 0.5em; cursor:pointer }
.highlight { background:orange; color:#fff; }
.button { background:#999; color:#eee; padding:0.2em 0.5em; cursor:pointer }
.highlight { background:orange; color:#fff; }
span {
display: inline-block;
width: 60px;
float: left;
text-align: center;
}
span {
display: inline-block;
width: 60px;
float: left;
text-align: center;
}
</style>
</style>
</head>
<body>
<div id="info">
<a href="http://threejs.org" target="_blank">three.js</a> -
STL loader test by <a href="https://github.com/aleeper">aleeper</a>
<p></p>
<div style="display:inline-block; width:310px; text-align: left" >
<span id="clickBinary" class="button highlight" >Binary</span>
&nbsp- PR2 head from <a href="http://www.ros.org/wiki/pr2_description">www.ros.org</a>
</div>
<p></p>
<div style="display:inline-block; width:310px; text-align: left" >
<span id="clickASCII" class="button" >ASCII</span>
&nbsp- A simple CAD part.
</div>
<p></p>
<div style="display:inline-block; width:310px; text-align: left" >
<span id="clickBinary" class="button highlight" >Binary</span>
&nbsp- PR2 head from <a href="http://www.ros.org/wiki/pr2_description">www.ros.org</a>
</div>
<p></p>
<div style="display:inline-block; width:310px; text-align: left" >
<span id="clickASCII" class="button" >ASCII</span>
&nbsp- A simple CAD part.
</div>
</div>
<script src="../build/three.min.js"></script>
......@@ -68,7 +68,7 @@
var camera, scene, renderer, objects = [];
var button_binary, button_ASCII;
var buttonBinary, buttonASCII;
init();
animate();
......@@ -78,11 +78,11 @@
container = document.createElement( 'div' );
document.body.appendChild( container );
// Set up buttons
button_binary = document.getElementById('clickBinary');
button_binary.addEventListener( "click", loadBinaryExample, false );
button_ASCII = document.getElementById('clickASCII');
button_ASCII.addEventListener( "click", loadASCIIExample, false );
// Set up buttons
buttonBinary= document.getElementById('clickBinary');
buttonBinary.addEventListener( "click", loadBinaryExample, false );
buttonASCII = document.getElementById('clickASCII');
buttonASCII.addEventListener( "click", loadASCIIExample, false );
camera = new THREE.PerspectiveCamera( 35, window.innerWidth / window.innerHeight, 1, 15 );
camera.position.set( 3, 0.5, 3 );
......@@ -123,7 +123,7 @@
plane.receiveShadow = true;
// Object
loadBinaryExample();
loadBinaryExample();
// Lights
......@@ -196,70 +196,69 @@
}
function loadBinaryExample() {
button_binary.className = "button highlight";
button_ASCII.className = "button";
function loadBinaryExample() {
buttonBinary.className = "button highlight";
buttonASCII.className = "button";
// Clear out old objects
for(var i = 0; i < objects.length; i++)
scene.remove(objects[i]);
// Clear out old objects
for(var i = 0; i < objects.length; i++)
scene.remove(objects[i]);
var scale = 2.0;
var material = new THREE.MeshPhongMaterial( { ambient: 0x555555, color: 0xAAAAAA, specular: 0x111111, shininess: 200 } );
var scale = 2.0;
var material = new THREE.MeshPhongMaterial( { ambient: 0x555555, color: 0xAAAAAA, specular: 0x111111, shininess: 200 } );
loadFile('./models/stl/binary/pr2_head_pan.stl', scale, new THREE.Vector3(0,0,0), new THREE.Vector3(-Math.PI/2, 0, 0), material);
loadFile('./models/stl/binary/pr2_head_tilt.stl', scale, new THREE.Vector3(0.068*scale, 0, 0), new THREE.Vector3(-Math.PI/2, 0.3, 0), material);
loadFile('./models/stl/binary/pr2_head_pan.stl', scale, new THREE.Vector3(0,0,0), new THREE.Vector3(-Math.PI/2, 0, 0), material);
loadFile('./models/stl/binary/pr2_head_tilt.stl', scale, new THREE.Vector3(0.068*scale, 0, 0), new THREE.Vector3(-Math.PI/2, 0.3, 0), material);
}
}
function loadASCIIExample() {
buttonBinary.className = "button";
buttonASCII.className = "button highlight";
function loadASCIIExample() {
button_binary.className = "button";
button_ASCII.className = "button highlight";
// Clear out old objects
for(var i = 0; i < objects.length; i++)
scene.remove(objects[i]);
// Clear out old objects
for(var i = 0; i < objects.length; i++)
scene.remove(objects[i]);
loadFile('./models/stl/ascii/slotted_disk.stl', 1.0, null, new THREE.Vector3(-Math.PI/2, 0, 0));
loadFile('./models/stl/ascii/slotted_disk.stl', 1.0, null, new THREE.Vector3(-Math.PI/2, 0, 0));
}
}
function loadFile( filename, scale, offset, rotate, material ) {
function loadFile( filename, scale, offset, rotate, material ) {
if(scale == null)
scale = 1.0;
if(scale == null)
scale = 1.0;
if(offset == null)
offset = new THREE.Vector3(0,0,0);
if(offset == null)
offset = new THREE.Vector3(0,0,0);
if(rotate == null)
rotate = new THREE.Vector3(0,0,0);
if(rotate == null)
rotate = new THREE.Vector3(0,0,0);
if(material == null)
material = new THREE.MeshPhongMaterial( { ambient: 0xff5533, color: 0xff5533, specular: 0x111111, shininess: 200 } );
if(material == null)
material = new THREE.MeshPhongMaterial( { ambient: 0xff5533, color: 0xff5533, specular: 0x111111, shininess: 200 } );
var loader = new THREE.STLLoader();
loader.addEventListener( 'load', function ( event ) {
var loader = new THREE.STLLoader();
loader.addEventListener( 'load', function ( event ) {
var geometry = event.content;
var mesh = new THREE.Mesh( geometry, material );
var geometry = event.content;
var mesh = new THREE.Mesh( geometry, material );
mesh.scale = new THREE.Vector3(scale, scale, scale);
mesh.position = offset;
mesh.rotation = rotate;
mesh.scale = new THREE.Vector3(scale, scale, scale);
mesh.position = offset;
mesh.rotation = rotate;
mesh.castShadow = true;
mesh.receiveShadow = true;
mesh.castShadow = true;
mesh.receiveShadow = true;
objects.push(mesh);
scene.add( objects[ objects.length - 1 ] );
objects.push(mesh);
scene.add( objects[ objects.length - 1 ] );
} );
loader.load( filename );
} );
loader.load( filename );
}
}
function animate() {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或