javascript - ReferenceError: THREE is not defined in a Rails Project with the threejs-rails gem -
i working in ruby on rails project three.js. installed corresponding gem , seems work fine. somehow javascript still throws following error:
uncaught referenceerror: 3 not defined
on line:
renderer = new three.webglrenderer();
the weird thing program seems working. object gets displayed.
my javscript file looks this:
// set size size of containing box var box = document.getelementbyid('player'); if(box){ var boxsize = box.clientwidth; } var = 0.05; // set camera attributes var view_angle = 45, aspect = 1, near = 0.1, far = 10000; var camera, scene, renderer; var $player; var char, materialchar ; init(); animate(); function init() { renderer = new three.webglrenderer(); camera = new three.perspectivecamera( 75, 1, 0.1, 10000 ); camera.position.y = 10; camera.position.z = 20; scene = new three.scene(); // dom element attach // - assume we've got jquery hand $player = $('#player'); // attach render-supplied dom element $player.append(renderer.domelement); // create character initchar(); // create point light addlight(); scene.add(camera); // draw! renderer.setsize(boxsize, boxsize); renderer.render(scene, camera); renderer.shadowmap.enabled = true; document.getelementbyid("player").addeventlistener("click", zoom); } function addlight(){ var dirlight = new three.directionallight(0xffffff, 1); dirlight.position.set(100, 100, 50); scene.add(dirlight); var amblight = new three.ambientlight(0x404040); scene.add(amblight); var bluepoint = new three.pointlight(0x0033ff, 3, 150); bluepoint.position.set( 70, 5, 70 ); scene.add(bluepoint); scene.add(new three.pointlighthelper(bluepoint, 3)); var greenpoint = new three.pointlight(0x33ff00, 1, 150); greenpoint.position.set( -70, 5, 70 ); scene.add(greenpoint); scene.add(new three.pointlighthelper(greenpoint, 3)); } function initchar(){ var textureloader = new three.textureloader(); var texture = textureloader.load('<%= asset_path 'grey.jpg' %>'); materialchar = new three.meshbasicmaterial({ map: texture }); var loader = new three.jsonloader(); loader.load('<%= asset_path 'standard-male-figure2.json' %>', function(geometry){ char = new three.mesh( geometry, materialchar ); scene.add(char); }); } function animate(){ requestanimationframe( animate ); render(); } function render(){ //char.rotation.y += 0.05; renderer.render( scene, camera ); } function zoom(){ camera.position.z = camera.position.z - 10; }
i have similar problem in rails 4.2. think default jquery / ajax gem missing following component. have linked in erb solved problem. can configured precompile using asset pipeline if choose to.
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r79/three.min.js"></script>
Comments
Post a Comment