Skip to content

Instantly share code, notes, and snippets.

@user01

user01/box.external.002.blend

Last active April 26, 2016 18:37
Show Gist options
  • Save user01/e3cf74cbfea20b62c7043a4ecef9200e to your computer and use it in GitHub Desktop.
Save user01/e3cf74cbfea20b62c7043a4ecef9200e to your computer and use it in GitHub Desktop.
Download ZIP
Many Boring Boxes
Raw
box.external.002.json
{
"materials":[{
"mapDiffuseAnisotropy":1,
"colorEmissive":[0,0,0],
"depthWrite":true,
"colorDiffuse":[0.64,0.64,0.64],
"transparent":false,
"DbgColor":15658734,
"mapDiffuse":"cardboard_box_02_low_cardboard_box_02_material_AlbedoTransparency.jpg",
"wireframe":false,
"visible":true,
"depthTest":true,
"blending":"NormalBlending",
"DbgIndex":0,
"colorSpecular":[0.5,0.5,0.5],
"shading":"phong",
"opacity":1,
"mapDiffuseRepeat":[1,1],
"specularCoef":50,
"mapDiffuseWrap":["RepeatWrapping","RepeatWrapping"],
"DbgName":"Material.001"
}],
"vertices":[0.3048,0.05193,-0.271345,0.3048,0.055852,-0.275712,0.3048,-0.055852,-0.276085,0.3048,-0.05193,-0.271345,0.3048,-0.05193,-0.316736,0.3048,-0.055852,-0.312369,0.3048,0.05193,-0.316736,0.3048,0.055852,-0.311996,0.296944,0.05193,-0.271345,0.296944,-0.05193,-0.316736,0.296944,-0.055852,-0.312369,0.296944,-0.05193,-0.271345,0.296944,-0.055852,-0.276085,0.3048,-0.2032,0,0.3048,-0.2032,-0.404204,0.3048,-0.130103,-0.34413,0.3048,0.2032,-0,0.3048,0.2032,-0.34413,0.30922,-0.129011,-0.343795,0.30922,0.207075,-0.420028,0.30922,0.207075,-0.343795,0.3048,-0.2032,-0.420028,0.3048,-0.2032,-0.276085,0.3048,-0.2032,-0.312369,0.3048,0.2032,-0.404204,0.307625,-0.2032,-0.403869,0.30922,0.207075,-0.403869,-0.3048,0.05193,-0.272982,-0.3048,0.052941,-0.274275,-0.3048,-0.053703,-0.276085,-0.3048,-0.05193,-0.272982,-0.3048,0.053703,-0.310559,-0.3048,0.05193,-0.313662,-0.3048,-0.05193,-0.313662,-0.3048,-0.052941,-0.312369,-0.296944,0.053703,-0.310559,-0.296944,0.05193,-0.313662,-0.296944,0.052941,-0.274275,-0.296944,0.05193,-0.272982,-0.296944,-0.05193,-0.313662,-0.296944,-0.052941,-0.312369,-0.296944,-0.05193,-0.272982,-0.296944,-0.053703,-0.276085,-0.3048,-0.2032,0,0.307625,-0.2032,-0.420028,-0.3048,-0.2032,-0.272982,-0.3048,-0.130103,-0.34413,-0.3048,0.2032,-0,-0.3048,0.2032,-0.34413,-0.30922,-0.129011,-0.343795,-0.30922,0.207075,-0.343795,-0.3048,-0.2032,-0.420028,-0.3048,0.2032,-0.272982,-0.3048,0.2032,-0.274275,-0.3048,0.2032,-0.310559,-0.3048,-0.2032,-0.276085,-0.3048,-0.2032,-0.312369,-0.3048,-0.2032,-0.404204,-0.3048,0.2032,-0.312369,-0.3048,0.2032,-0.404204,-0.307625,-0.2032,-0.403869,-0.30922,0.207075,-0.403869,-0.307625,-0.2032,-0.420028,-0.30922,0.207075,-0.420028,0.3048,-0.2032,-0.316736,0.3048,-0.2032,-0.271345,0.296944,0.055852,-0.275712,0.296944,0.05193,-0.316736,0.296944,0.055852,-0.311996,0.3048,0.2032,-0.311996,0.3048,0.2032,-0.316736,0.3048,0.2032,-0.271345,0.3048,0.2032,-0.275712],
"normals":[0,1,-0,0,-0.770426,0.637529,-0,0,-1,1,0,0,0,0.743965,0.668218,0,-1,0,0,0.770427,-0.637528,0.999926,-0.002136,-0.01195,-0.075674,0,0.997133,0,-1,0,0,0,1,-0,0,1,0,-0.999779,-0.020994,0,0.999779,0.020994,0,-0.787709,-0.616047,0,-0,-1,-1,0,-0,0,0.787709,0.616047,0,-0.868242,0.49614,0,0.868242,-0.49614,-1,0,-0,-0.999926,-0.002136,-0.01195,0,1,0,0.075674,0,0.997133,0.023543,-0.632085,0.774541,0,1,-0,0,-1,0,-1,0,0,-1,-0,-0,-0.999992,-0.003886,-0,0,-0.086233,0.996275,0.999992,-0.003886,-0,-0.023543,-0.632085,0.774541,-0,-1,-0,1,0,-0,0,0,1,0,-0.743965,-0.668219,1,-0,-0],
"faces":[43,2,5,10,12,0,0,1,2,3,0,0,0,0,43,7,68,67,6,0,4,5,6,7,1,1,1,1,43,0,3,11,8,0,8,9,10,11,2,2,2,2,43,10,9,11,12,0,2,12,10,3,3,3,3,3,43,5,4,9,10,0,1,13,12,2,4,4,4,4,43,7,1,66,68,0,4,14,15,5,5,5,5,5,43,2,12,11,3,0,0,3,10,9,6,6,6,6,43,20,18,25,26,0,16,17,18,19,7,7,7,7,43,17,15,18,20,0,20,21,17,16,8,8,8,8,43,13,43,51,21,0,22,23,24,25,9,9,9,9,43,16,47,43,13,0,26,27,23,22,10,10,10,10,43,32,33,39,36,0,28,29,30,31,11,11,11,11,43,28,31,35,37,0,32,33,34,35,12,12,12,12,43,29,42,40,34,0,36,37,38,39,13,13,13,13,43,28,37,38,27,0,32,35,40,41,14,14,14,14,43,27,38,41,30,0,41,40,42,43,15,15,15,15,43,35,36,38,37,0,34,31,40,35,16,16,16,16,43,34,40,39,33,0,39,38,30,29,17,17,17,17,43,32,36,35,31,0,28,31,34,33,18,18,18,18,43,29,30,41,42,0,36,43,42,37,19,19,19,19,43,36,39,41,38,0,31,30,42,40,20,20,20,20,43,39,40,42,41,0,30,38,37,42,16,16,16,16,43,50,61,60,49,0,44,45,46,47,21,21,21,21,43,19,63,50,20,0,48,49,50,51,22,22,22,22,43,48,50,49,46,0,52,44,47,53,23,23,23,23,43,14,25,18,15,0,54,18,17,21,24,24,24,24,43,48,47,16,17,0,55,27,26,56,25,25,25,25,43,25,14,21,44,0,18,54,57,58,26,26,26,26,43,47,52,45,43,0,27,59,60,23,16,16,16,16,43,28,53,54,31,0,32,61,62,33,27,27,27,27,43,58,59,57,56,0,63,64,65,66,20,20,20,20,43,29,55,45,30,0,36,67,60,43,20,20,20,20,43,28,27,52,53,0,32,41,59,61,28,28,28,28,43,31,54,58,32,0,33,62,63,28,27,27,27,27,43,61,63,62,60,0,45,49,68,46,29,29,29,29,43,20,50,48,17,0,51,50,69,70,30,30,30,30,43,26,25,44,19,0,19,18,58,48,31,31,31,31,43,63,19,44,62,0,49,48,58,68,15,15,15,15,43,57,46,49,60,0,71,53,47,46,32,32,32,32,43,60,62,51,57,0,46,68,72,71,33,33,33,33,43,34,56,55,29,0,39,66,67,36,20,20,20,20,43,1,7,69,72,0,14,4,73,74,34,34,34,34,43,7,6,70,69,0,4,7,75,73,34,34,34,34,43,6,67,9,4,0,7,6,12,13,35,35,35,35,43,1,0,8,66,0,14,8,11,15,36,36,36,36,43,67,8,11,9,0,6,11,10,12,37,37,37,37,43,16,13,65,71,0,26,22,76,77,34,34,34,34,43,70,64,14,24,0,75,78,79,80,34,34,34,34,43,5,2,22,23,0,1,0,81,82,37,37,37,37,43,4,5,23,64,0,13,1,82,78,37,37,37,37,43,2,3,65,22,0,0,9,76,81,37,37,37,37,43,0,1,72,71,0,8,14,74,77,34,34,34,34,43,67,68,66,8,0,6,5,15,11,3,3,3,3],
"name":"Cube.001Geometry.12",
"metadata":{
"type":"Geometry",
"version":3,
"generator":"io_three",
"materials":1,
"vertices":73,
"normals":38,
"faces":53,
"uvs":1
},
"uvs":[[0.394531,0.102539,0.394531,0.080078,0.396484,0.082031,0.396484,0.100586,0.458008,0.080078,0.457031,0.081055,0.455078,0.079102,0.454102,0.077148,0.456055,0.106445,0.398438,0.106445,0.398438,0.102539,0.455078,0.102539,0.399414,0.080078,0.397461,0.077148,0.458984,0.102539,0.457031,0.100586,0.994141,0.06543,0.988281,0.237305,0.956055,0.277344,0.958008,0.064453,0.99707,0.068359,0.991211,0.239258,0.292969,0.291016,0.292969,0.708008,0.005859,0.708008,0.005859,0.291016,0.570312,0.291016,0.570312,0.708008,0.477539,0.922852,0.417969,0.922852,0.422852,0.918945,0.473633,0.919922,0.478516,0.895508,0.479492,0.920898,0.474609,0.917969,0.473633,0.899414,0.416016,0.897461,0.420898,0.900391,0.421875,0.917969,0.415039,0.922852,0.472656,0.898438,0.477539,0.894531,0.422852,0.898438,0.417969,0.894531,0.577148,0.066406,0.613281,0.064453,0.616211,0.277344,0.583008,0.238281,0.948242,0.064453,0.623047,0.064453,0.623047,0.024414,0.948242,0.024414,0.574219,0.069336,0.581055,0.240234,0.957031,0.27832,0.805664,0.708008,0.805664,0.291016,0.948242,0.28125,0.948242,0.279297,0.570312,0.893555,0.292969,0.893555,0.570312,0.895508,0.570312,0.920898,0.570312,0.922852,0.570312,0.985352,0.292969,0.985352,0.292969,0.922852,0.292969,0.896484,0.624023,0.280273,0.629883,0.018555,0.942383,0.018555,0.615234,0.279297,0.624023,0.28125,0.570312,0.080078,0.570312,0.103516,0.570312,0.077148,0.292969,0.106445,0.570312,0.106445,0.292969,0.077148,0.292969,0.017578,0.570312,0.017578,0.292969,0.102539,0.292969,0.080078]]
}
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - blender</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
font-family: Monospace;
background-color: #000000;
margin: 0px;
overflow: hidden;
}
#info {
color: #fff;
position: absolute;
top: 10px;
width: 100%;
text-align: center;
z-index: 100;
display: block;
}
a {
color: red
}
#container {
width: 100%;
height: 100vh;
}
form {
color: white;
}
div#controls {
position: absolute;
right: 2px;
top: 2px;
}
</style>
</head>
<body>
<div id="info">
<a href="http://threejs.org" target="_blank">three.js</a> - many boring boxes by <a href="https://sketchfab.com/root77/models"
target="_blank">root77</a>
</div>
<div id="controls">
<form>
<div>
<label for="name">Side Count:</label>
<input type="number" id="side-num" value="10" />
</div>
<label><input type="checkbox" id="parenting-enabled">Use parenting</label>
<div>
<button id="regen-scene">Regenerate Scene</button>
</div>
</form>
</div>
<div id="container"></div>
<script src="//cdnjs.cloudflare.com/ajax/libs/three.js/r76/three.min.js"></script>
<script src="stats.min.js"></script>
<script src="index.js"></script>
</body>
</html>
Raw
index.js
var camera, scene, renderer, objects;
var particleLight, pointLight;
var parent, stats;
var scale = 5;
var animationCallback;
var container = document.getElementById('container');
var sideCountElm = document.getElementById('side-num');
var parentingEnabledElm = document.getElementById('parenting-enabled');
var regenSceneBtn = document.getElementById('regen-scene');
regenSceneBtn.onclick = function (evt) {
evt.preventDefault();
// reset everything
while (container.firstChild) {
container.removeChild(container.firstChild);
}
cancelAnimationFrame(animationCallback);
window.addEventListener('resize', null, false);
init();
}
stats = new Stats();
document.getElementById('controls').appendChild(stats.dom);
function init() {
var parentingEnabled = parentingEnabledElm.checked;
var sideCount = Math.max(1, parseInt(sideCountElm.value));
camera = new THREE.PerspectiveCamera(50, container.clientWidth / container.clientHeight, 1, 2000);
camera.position.set(2, 4, 5);
scene = new THREE.Scene();
var geometry = new THREE.PlaneGeometry(5, 5, 5);
var material = new THREE.MeshBasicMaterial({ color: 0xffff00, side: THREE.DoubleSide });
parent = new THREE.Mesh(geometry, material);
scene.add(parent);
// Add Blender exported JSON model
var loader = new THREE.JSONLoader();
loader.load('box.external.002.json', function (geometry, materials) {
// adjust color a bit
var material = new THREE.MeshFaceMaterial(materials);
for (var i = 0; i < sideCount; i++) {
for (var j = 0; j < sideCount; j++) {
var mesh = new THREE.Mesh(geometry, material);
mesh.scale.set(scale, scale, scale);
mesh.position.set(i * scale, 0, j * scale);
mesh.rotation.z = THREE.Math.randFloat(-0.25, 0.25);
mesh.rotation.x = Math.PI / 2;
if (parentingEnabled) {
parent.add(mesh);
} else {
scene.add(mesh);
}
}
}
});
// Lights
scene.add(new THREE.AmbientLight(0xcccccc));
pointLight = new THREE.PointLight(0xff4400, 5, 30);
pointLight.position.set(5, 0, 0);
scene.add(pointLight);
// Renderer
renderer = new THREE.WebGLRenderer();
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(container.clientWidth, container.clientHeight);
container.appendChild(renderer.domElement);
// Events
window.addEventListener('resize', onWindowResize, false);
animate();
}
function onWindowResize(event) {
renderer.setSize(container.clientWidth, container.clientHeight);
camera.aspect = container.clientWidth / container.clientHeight;
camera.updateProjectionMatrix();
}
function animate() {
animationCallback = requestAnimationFrame(animate);
render();
}
function render() {
var timer = Date.now() * 0.0005;
parent.position.y = Math.sin(timer * 5) * 5;
camera.position.x = Math.cos(timer) * 20;
camera.position.y = 4;
camera.position.z = Math.sin(timer) * 20;
camera.lookAt(scene.position);
renderer.render(scene, camera);
stats.update();
}
init();
Raw
stats.min.js
// stats.js - http://github.com/mrdoob/stats.js
var Stats=function(){function h(a){c.appendChild(a.dom);return a}function k(a){for(var d=0;d<c.children.length;d++)c.children[d].style.display=d===a?"block":"none";l=a}var l=0,c=document.createElement("div");c.style.cssText="position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000";c.addEventListener("click",function(a){a.preventDefault();k(++l%c.children.length)},!1);var g=(performance||Date).now(),e=g,a=0,r=h(new Stats.Panel("FPS","#0ff","#002")),f=h(new Stats.Panel("MS","#0f0","#020"));
if(self.performance&&self.performance.memory)var t=h(new Stats.Panel("MB","#f08","#201"));k(0);return{REVISION:16,dom:c,addPanel:h,showPanel:k,begin:function(){g=(performance||Date).now()},end:function(){a++;var c=(performance||Date).now();f.update(c-g,200);if(c>e+1E3&&(r.update(1E3*a/(c-e),100),e=c,a=0,t)){var d=performance.memory;t.update(d.usedJSHeapSize/1048576,d.jsHeapSizeLimit/1048576)}return c},update:function(){g=this.end()},domElement:c,setMode:k}};
Stats.Panel=function(h,k,l){var c=Infinity,g=0,e=Math.round,a=e(window.devicePixelRatio||1),r=80*a,f=48*a,t=3*a,u=2*a,d=3*a,m=15*a,n=74*a,p=30*a,q=document.createElement("canvas");q.width=r;q.height=f;q.style.cssText="width:80px;height:48px";var b=q.getContext("2d");b.font="bold "+9*a+"px Helvetica,Arial,sans-serif";b.textBaseline="top";b.fillStyle=l;b.fillRect(0,0,r,f);b.fillStyle=k;b.fillText(h,t,u);b.fillRect(d,m,n,p);b.fillStyle=l;b.globalAlpha=.9;b.fillRect(d,m,n,p);return{dom:q,update:function(f,
v){c=Math.min(c,f);g=Math.max(g,f);b.fillStyle=l;b.globalAlpha=1;b.fillRect(0,0,r,m);b.fillStyle=k;b.fillText(e(f)+" "+h+" ("+e(c)+"-"+e(g)+")",t,u);b.drawImage(q,d+a,m,n-a,p,d,m,n-a,p);b.fillRect(d+n-a,m,a,p);b.fillStyle=l;b.globalAlpha=.9;b.fillRect(d+n-a,m,a,e((1-f/v)*p))}}};"object"===typeof module&&(module.exports=Stats);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment