How to 'resize' or make a triangle responsive in JavaScript?

Question

I am pretty new to this so hopefully this is an easy question..

How do I resize/make responsive a triangle relative to another shape in javascript?

I am essentially trying to make a 'shirt' that resizes all the shapes when I change one of the variable values.

Here is what I am working with:

/* // define variables
var clothingColor = color(30, 74, 10);
var shirtSize = 180;
var increase = 0;
var startX = 82;
var startY = startX + 28;


// draw it, using those variables
fill(clothingColor);


triangle(startX - 55, startX + 34, startX - 3, startX + 107, startX + 38, startX +    30);//left sleeve


triangle(startX + 230,startX + 34,startX + 185,startX + 107,startX + 147,startX + 30);//right sleeve

rect(startX - increase, startY - increase, shirtSize + increase * 2, shirtSize + increase * 2);//body

fill(255, 252, 252);
arc(startX +91,startX + 28, 111, -21, -190, 11);//collar */

How do I make the triangle/arc resize equally when I change the shirt size/increase variable?

Answer 1

Make the startX value dependent on the shirtSize value.

startX = shirtSize/2.1;  // no specific calculation used  

That khana site is detecting changes in the text/javascript file and responding to that. It has its own javascript running as well. I went in to change the shirtsize, and the graphic changed, but the triangles did not because none of the values to create the triangle were changed.