Three.js Applying Repeated Texture to JSON Scene Object -
i have basic json scene exported three.js/editor. want add repeated texture wrap object in scene not know how since examples have found add wrap in creation of object.
i have tried accessing texture , giving wrap, think might need add texture object javascript declare texture wrap instead of trying add loaded texture.
<script> var camera, scene, renderer; var mesh; init(); animate(); function init() { camera = new three.perspectivecamera( 70, window.innerwidth / window.innerheight, 1, 1000 ); camera.position.z = 400; scene = new three.scene(); var objectloader = new three.objectloader(); objectloader.load( "models/cube.json", function ( obj ) { scene.add( obj ) obj.traverse(function(child) { if (child instanceof three.mesh) { child.castshadow = true; child.receiveshadow = true; } }); obj.name = "cube"; obj.position.set(0,0,0); obj.scale.set(200,200,200); }); renderer = new three.webglrenderer(); renderer.setpixelratio( window.devicepixelratio ); renderer.setsize( window.innerwidth, window.innerheight ); document.body.appendchild( renderer.domelement ); // window.addeventlistener( 'resize', onwindowresize, false ); while (scene.getobjectbyname('box 1')){ var texture = scene.getobjectbyname('box 1').material; texture.wraps = three.repeatwrapping; texture.wrapt = three.repeatwrapping; texture.repeat.set( 2, 2 ); } } function onwindowresize() { camera.aspect = window.innerwidth / window.innerheight; camera.updateprojectionmatrix(); renderer.setsize( window.innerwidth, window.innerheight ); } function animate() { requestanimationframe( animate ); if (scene.getobjectbyname('box 1') ){ scene.getobjectbyname('box 1').material.map.offset.x += 0.001; } renderer.render( scene, camera ); } </script>
you need set wrap , repeat properties of texture/map , not of material. docs it's important set needsupdate true, if wrap settings changed. , trying set properties before json loaded (in while loop?). should within load callback.
objectloader.load( "models/cube.json", function ( obj ) { scene.add( obj ) obj.traverse(function(child) { if (child instanceof three.mesh) { child.castshadow = true; child.receiveshadow = true; } }); obj.name = "cube"; obj.position.set(0,0,0); obj.scale.set(200,200,200); var box1 = scene.getobjectbyname('box 1'); if (box1) { var texture = box1.material.map; texture.wraps = three.repeatwrapping; texture.wrapt = three.repeatwrapping; texture.repeat.set( 2, 2 ); texture.needsupdate = true; } });
Comments
Post a Comment