CODEWITHSUNDEEP
javascriptthree.js
muckbuck
muckbuck

Reputation: 71

Three JS boxGeometry, render warning: Render count or primcount is 0

I'm trying to pass data from a html-form to three parameters representing the x, y and z dimension of the boxGeometry. It works fine when I set the parameter values manually, but not when the parameters are set by the values entered in the form.

HTML 

    <form>
        <input type="text" name="valueX" id="valueX">
        ValueX<br>
        <input type="text" name="valueY" id="valueY">
        ValueY<br>
        <input type="text" name="valueZ" id="valueZ">
        ValueZ<br>
    </form>
    <button onclick="render()">Render that box!</button>

JS

var geometry = newTHREE.BoxGeometry(parseInt(document.getElementById('valueX').value) ,parseInt(document.getElementById('valueY').value) ,parseInt(document.getElementById('valueZ').value));

var material = new THREE.MeshLambertMaterial({color:0x00ff20});

var cube = new THREE.Mesh(geometry,material);

scene.add(cube);

function render (){
 cube.rotation.x += 1;
 cube.rotation.y += 1;
 renderer.render(scene,camera);
}

Upvotes: 0

Views: 484

Answers (1)

WestLangley
WestLangley

Reputation: 104803

<button onclick="go()">Render that box!</button>


function go() {

    var geometry = new THREE.BoxGeometry( parseInt(document.getElementById('valueX').value), parseInt(document.getElementById('valueY').value), parseInt(document.getElementById('valueZ').value) );

    var material = new THREE.MeshLambertMaterial( { color:0x00ff20 } );

    var cube = new THREE.Mesh( geometry, material );

    scene.add( cube );

    render();

}

three.js r.75

Upvotes: 2

Related Questions