CODEWITHSUNDEEP
javascripttestingparametersthree.js
Deex
Deex

Reputation: 327

JS and three.js, Parameter testing in Browser

i was building a small 3D App with three.js. Inside my script i have to add a lot of vars like Model Size, camera Distance and many more. Because it is real hard to change my parameter, save it, and rerun the window to see how the initial pose of the model will look like, i ask myself if there is the possibility to update the javascript parameter in realtime (in my browser) or give out the current vars (like position) with an firefox addon or something for other browser (in production mode).

I already tried a lot of things with firebug and was able to manipulate the parameter but can't see the result of it in realtime.

Other notes: I'm using orbital to move the model arround.

The code that i use for the vars on the output are

<script>
callback=function(){options={"width":"440","height":"300","background":"ffffff","opacity":"0","modelPosition":[0,0,0],"modelScale":[50,50,50],"ambient":4210752,"directionalPosition":[99,99,99],"directionalColor":16777215,"cssClass":"3d","cssStyle":"float: right","id":"gnet_viewer","fps":"20","camera":[50,50,30],"fov":"70","material":"https:\/\/wow.gnetwork.eu\/assets\/uploads\/2016\/05\/test1.mtl"};wp3d=new WP3D('https://wow.gnetwork.eu/assets/uploads/2016/05/test1-1.obj',options);wp3d.render();}
if(window.addEventListener){window.addEventListener('load',callback,false);}else{window.attachEvent('onload',callback);}
</script>

Upvotes: 0

Views: 32

Answers (1)

Bitwise Creative
Bitwise Creative

Reputation: 4105

Assuming your animation loop handles scene updates, you could simply make global references to them and update them in the console.

There's also dat.GUI, which is commonly used for this very purpose.

http://workshop.chromeexperiments.com/examples/gui/#1--Basic-Usage

Upvotes: 1

Related Questions