Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.

Thread: Processingjs and the Draw Function

1. Processingjs and the Draw Function

I'd like this piece of code to draw numShape number of triangles, but it just keeps drawing one triangle at a time and looping forever.
This is probably pretty basic, any help is appreciated!
Code:
```if (typeShape=="Triangle"||typeShape=="triangle")
{
var triangleWidth = 30;
var triangleHeight = 30;
var triangleoneX = random(canvasWidth-triangleWidth);
var triangleoneY = random(canvasHeight-triangleHeight);
var triangletwoX = triangleoneX+(0.5*triangleWidth);
var triangletwoY = triangleoneY-triangleHeight;
var trianglethreeX = triangleoneX+triangleWidth;
var trianglethreeY = triangleoneY;

for(i = 0;i < numShape; i = i + 1)
{
triangle(triangleoneX,triangleoneY,triangletwoX,triangletwoY,trianglethreeX,trianglethreeY);
}
}```

• hi Pollen,

i think your loop is calling your function triangle multiple times, however your values aren't changing. You get the random variables from the function and these same variables are being called repeatedly, thus you only see the same triangle (however i could be wrong about this but when i fiddled with your code i just saw the same values repeating).

You may want to change the structure of your calls...i worked up a small function since i don't know what your triangle function looks like...maybe this might help to bring your code in the right direction and create multiple different triangles (keep in mind this is simple and thus not guarantee that the randomness will not call the same values twice)

Code:
```<!DOCTYPE html>
<html>
<script>
var canvasWidth = 320;
var canvasHeight=500;

function mult(){
var triangleWidth = 30;
var triangleHeight = 30;
var triangleoneX = Math.random(canvasWidth-triangleWidth);
var triangleoneY = Math.random(canvasHeight-triangleHeight);
var triangletwoX = triangleoneX+(0.5*triangleWidth);
var triangletwoY = triangleoneY-triangleHeight;
var trianglethreeX = triangleoneX+triangleWidth;
var trianglethreeY = triangleoneY;
return (triangleoneX+triangleoneY+triangletwoX+triangletwoY+trianglethreeX+trianglethreeY);
}

function test(){
var x = prompt('enter the letter Y or y');
if(x.toLowerCase()=='y'){
for(var i = 0;i<3;i++){
var result = mult();
document.getElementById('demo').innerHTML += result+"<br/>";
}
}
}
</script>
<body>
<p id="demo"></p>
<button type="button" onclick="test()">Values</button>

</body>
</html>```

• Users who have thanked Brandnew for this post:

Pollen (08-12-2013)

•