#### Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

# Changing triangle into center mode

Posts: 253
-- I'm trying to get triangles in center mode
so they can be spun in separate directions using the rotate CMD...

Does anyone have any ideas ????

Right now it seems to be spinning in corner mode…..

~~~
displayMode(FULLSCREEN)
rectMode(CENTER)

function setup()
t1= MakeTriangle(vec2(250,150),vec2(480,150),vec2(360,250),color(0, 0, ,255))
t2= MakeTriangle(vec2(150,150),vec2(380,150),vec2(260,250),color(0, 255, ,0))
end

function MakeTriangle(v1,v2,v3,c)
m=mesh()
m.vertices={v1,v2,v3}
m:setColors(c)
return m
end

function draw()
background(0)
-- pushMatrix()
t1:draw()
rotate(5)
t2:draw()
-- popMatrix()
end
~~~

• edited September 11 Posts: 1,867
@kendog400 - I think you'll have to calculate the centre point yourself, then calculate the corner points as offsets of that. You can then rotate the points mathematically.

There is a demo in Examples using a mesh which may give you some hints.
• Posts: 762

if you translate to the triangle center, then rotate, then draw, you should get what you need. you'll need a few push and pop matrix calls to get back for the next draw.

• Mod
Posts: 8,674
``````displayMode(FULLSCREEN)

function setup()
stroke(255)
strokeWidth(2)
ang=0
size=300
-- create triangle points
end

function draw()
background(0)
translate(WIDTH/2,HEIGHT/2)
rotate(ang)
line(x1,y1,x2,y2)
line(x2,y2,x3,y3)
line(x1,y1,x3,y3)
translate()
ang=ang+1
end
``````
• Posts: 253
Thanks everyone !
• Posts: 253
Everything works but I still havent figured where the triangle center point is, it seems like I'm adjusting the background or screen mode with translate, I will soon need that to when I circle a bunch of triangles and spin them all at once..
• Posts: 253
~~~
-- Plain triangle

--[[ if you translate to the triangle center, then rotate, then draw, you should get what you need. you'll need a few push and pop matrix calls to get back for the next draw. ]]--

displayMode(FULLSCREEN)

function setup()
a=0 -- a is the angle
-- ( right, bottom, top )
t1 = MakeTriangle (vec2(250,150), vec2(480,150), vec2(360,250), color(0, 0, 255))
end

function MakeTriangle (v1, v2, v3, c) m=mesh()
m.vertices={v1, v2, v3} m:setColors(c)
return m
end

function draw()
background(0)
a=a+1
translate(WIDTH/2-200,HEIGHT/2-100)
rotate(a)
t1:draw()
translate()
end
~~~
• edited September 13 Posts: 253
Is there some mathmaticle formula to calculate the center point of a triangle ???
My triangle seems to be going off the screen...
• Posts: 253
Thanks to anyone and everyone !
• Posts: 762

Here's an example using triangle centroid, one of the ways to compute a triangle's center. Questions welcome.

``````-- Counter-rotating triangles
-- RJ 20200913

function setup()
t1 = Triangle(vec2(500,500), 1)
t2 = Triangle(vec2(700,700), -1)
end

function draw()
background(0)
stroke(255)
strokeWidth(2)
t1:draw()
t2:draw()
end

Triangle = class()

function Triangle:init(pos, dir)
self.pos = pos
self.dir = dir
self.points = {vec2(250,150), vec2(480,150), vec2(360,250),vec2(250,150)}
self.angle = 0
end

function Triangle:draw()
pushStyle()
pushMatrix()
translate(self.pos.x, self.pos.y)
rotate(self.angle)
for i = 1,3 do
local p1 = self.points[i]
local p2 = self.points[i+1]
line(p1.x,p1.y, p2.x, p2.y)
end
popMatrix()
popStyle()
self.angle = self.angle + self.dir
end

local c = self:centroid()
for i = 1,4 do
self.points[i] = self.points[i]-c
end
end

function Triangle:centroid()
p1 = self.points[1]
p2 = self.points[2]
p3 = self.points[3]
centroidx = (p1.x+p2.x+p3.x)/3
centroidy = (p1.y+p2.y+p3.y)/3
return vec2(centroidx, centroidy)
end
``````
• edited September 13 Posts: 762

The basic trick here is to draw the triangle centered around its "center", the centroid in this case. I do that by subtracting the centroid from each of the triangle's coordinates, so that it is now "local" to the centroid. Then the translate command positions us at that centroid - center, and we can then rotate and draw.

The centroid is just the average of the corners. Could be calculated in vector mode but I didn't.

``````c = (p1+p2+p3)/3
``````

should work just fine. Not tested.

p.s. tested, works,

``````function Triangle:centroid()
p1 = self.points[1]
p2 = self.points[2]
p3 = self.points[3]
return (p1+p2+p3)/3
end
``````
• Mod
Posts: 8,674

Here’s something I had from long ago.

``````displayMode(FULLSCREEN)

function setup()
size=50
count=0
tab={}
end

function draw()
background(132, 224, 217, 255)
fill(255)
for a,b in pairs(tab) do
b:draw()
end
count=count+1
if count>30 then
count=0
table.insert(tab,m(math.random(size,WIDTH-size),math.random(size,HEIGHT-size),math.random(360)))
end
end

m=class()

function m:init(x,y,r)
self.x=x
self.y=y
self.rot=r
self.ms=mesh()
self.col=color(math.random(255),math.random(255),math.random(255))
self.count=math.random(-4,4)
self.sz=math.random(size)
end

function m:draw()
pushMatrix()
translate(self.x,self.y)
rotate(self.rot)
self.ms.vertices={vec2(-self.sz,-self.sz),vec2(self.sz,-self.sz),vec2(0,self.sz*1.414)}
self.ms:setColors(self.col)
self.rot=self.rot+self.count
self.ms:draw()
popMatrix()
end
``````
• Posts: 253
Replaced two lines…
Added fill in the draw fx

Got error msg :
Main : 58 : bad argument
# -2 to '_ _ add' (vec2)
stack traceback : [c] in meta method '_ _ add'
Main : 58 : in method 'draw'
Main : 31 : in function 'draw'
• Posts: 253
~~~
— Centeroid
displayMode(FULLSCREEN)
function setup()
angle=0
-- replaced two lines
t1 = Triangle (vec2(250,150), vec2(480,150), vec2(360,250), 1)
t2 = Triangle (vec2(350,150), vec2(580,150), vec2(560,350), -1)
end

function draw()
background(0)
stroke(255)
strokeWidth(2)
fill(0, 0, 255) — added t
1:draw()
t2:draw()
end

Triangle = class()
function Triangle:init(pos, dir)
self.pos = pos
self.dir = dir
self.points = {vec2(250,150), vec2(480,150), vec2(360,250),vec2(250,150)} self:adjustToCentroid()
self.angle = 0 end

function Triangle:draw()
pushStyle()
pushMatrix()
translate(self.pos.x, self.pos.y) rotate(self.angle)
for i = 1,3 do local p1 = self.points[i] local p2 = self.points[i+1] line(p1.x,p1.y, p2.x, p2.y)
end
popMatrix()
popStyle()
self.angle = self.angle + self.dir
end

local c = self:centroid()
for i = 1,4 do self.points[i] = self.points[i]-c
end
end

function Triangle:centroid()
p1 = self.points[1]
p2 = self.points[2]
p3 = self.points[3]
centroidx = (p1.x+p2.x+p3.x)/3
centroidy = (p1.y+p2.y+p3.y)/3
return vec2(centroidx, centroidy)
end
~~~
• Mod
Posts: 8,674

Triangle:init only has 1 pos and 1 dir, but your calling it with 3 vec2 values and 1 dir value

• Posts: 253
I got pgm from RonJefferies, l never complain, I appreciate any and all the help I get....
• Posts: 253
I'm looking over pgm, I just havent figured out where to make adjustments....
• Mod
Posts: 8,674

@kendog400 A suggestion. When you make changes to a program that originally worked, make a small change. If you get an error, fix that error or remove it before you make more changes. Constantly making changes to someone’s program and then asking why it doesn’t work isn’t going to help you learn. In my comment above, I gave you what you need to do to fix it.

• edited September 15 Posts: 253
Ok, I went back to the drawing board, I still haven’t seen any rotation as of yet
~~~
-- Rotating Triangle

displayMode(FULLSCREEN)
--====================
function setup()
ang=0
-- the vec points
a=-120 -- right side x position
b=-60 -- right side y position
c= 100 -- left side x position
d=-60 -- left side y position
e=-10 -- tips x position
f= 60 -- tips y position
--..............................................................
-- ( left, right, tip )
t1 = MakeTriangle (vec2(a,b), vec2(c,d), vec2(e,f), color(0, 0, 255))
--...............................................................
end
--==============================
function draw()
background(0)
--...............................................................
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35) -- this is the wht highliteer
--...............................................................
translate(WIDTH/2,HEIGHT/2)
t1:draw()
rotate(ang)
ang=ang+1
end
--===========================
function MakeTriangle (v1, v2, v3, c)
m=mesh()
m.vertices={v1, v2, v3}
m:setColors(c)
return m
end
~~~
• Posts: 253
I think I’m getting close.....
• Mod
Posts: 8,674

You were close. The rotate goes before the draw. Add 1 to ang, not a.

``````    translate(WIDTH/2,HEIGHT/2)
rotate(ang)
t1:draw()
ang=ang+1
``````
• Posts: 253
Somehow I did it ! I had a ‘a’ instead of ang.... but I have 1 more question : how can I make this spin in reverse ??
• Posts: 253
I have another question, I put 4 ellipses in a table, I don’t know if this should be in a table or class, and I’m trying to make the table rotate from the center...
• Posts: 253
~~~
-- Ellipses
--=========================
function setup()
ellipseMode(CORNER)
a=0
c { ellipse(350,200,50,100), ellipse(350,100,50,100),
ellipse(385,175,100,50), ellipse(265,175,100,50) }
end
--========================
function draw()
background(0)
translate (WIDTH/2,HEIGHT/2)
fill(132, 217, 215)
a=a+1
rotate(a)
c:draw()
end
--========================
~~~

Does this look right ?? Or was I supposed to approach this from another angle ??? Maneuver these ellipse should be in a class...
• Mod
Posts: 8,674

@kendog400 You can’t take a working program and make wild changes to it and expect it to work. Your above code is so wrong I don’t think anything can be done to it to get it to work, other than deleting it and writing something else. Sorry for being so blunt, but ...

• Posts: 253
It's ok, I'm not good as you when it comes to programming...I would like to get that gud ..
• Posts: 253
This wasn't a working pgm, I made this up myself...I had an idea I just didn't know how to implement it...I was thinking I could put objects in a table and rotate the whole table, or mabey it would be better off in a class.....Cud u give me an idea on how to approach this ??? If I cud get by this one hurdle I cud get my roll going on...
• Mod
Posts: 8,674

Here’s your code, fixed somewhat. Don’t know what you were trying to do. I didn’t know anything about Codea/Lua when I started, but I just kept writing small programs until I understood what I was doing. Then I started writing larger ones, trying different things until I understood what they were doing. There’s still a lot that I don’t know, and I’m still learning. So just hang in there and write small code that you understand and try modifying it a little so you see what that’s doing. If you know a lot of small things, you can combine them into larger things.

``````displayMode(FULLSCREEN)

function setup()
a=0
c ={vec4(350,200,50,100),vec4(450,200,50,100),
vec4(400,150,100,50),vec4(400,250,100,50) }
end
function draw()
background(0)
for z=1,#c do
pushMatrix()
translate (c[z].x,c[z].y)
rotate(a)
fill(132, 217, 215)
ellipse(0,0,c[z].z,c[z].w)
translate()
popMatrix()
end
a=a+1
end
``````
• Posts: 253
Thanks ! ...
• Posts: 253
I have a quick question : does codea have other shapes like stars using vec2 commands ? Can a programmer make other shapes by adding vec2 points ? I checked the graphics help and only seen rect, ellipse, and that's all...
• Posts: 1,867
@kendog400 - you can build your own classes for different shapes, you may find code in the previous threads.
• Posts: 253
Can you Sen me a link to one so I cud take a peek and see how it's done ??
• Posts: 253
I have here 4 ellipses...I want to know if I should put them in a table or a class to spin them from the center...
~~~
-- still ellipses

displayMode(FULLSCREEN)

function setup()
end

function draw()
background(0)
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35) -- this is the wht highliteer

for i=1,4 do -- just show the 4 ellipses in a still position
fill(255)
e1 = ellipse (175,200, 50)
e2 = ellipse (480,200, 50)
e3 = ellipse (325,300, 50)
e4 = ellipse (325,100, 50)
end
end
~~~
• Posts: 253
Here they are spinning but not from center mode, as you can see they move off the screen, I’m trying to keep them on the screen :
~~~
displayMode(FULLSCREEN)
function setup()
-- ellipesMode(CORNER)
ang=0
end

function draw()
background(0)
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35)
-- this is the wht highliteer
for i=1,4 do
ang=ang+0.1
fill(255)
translate(50,0)
e1 = ellipse (175,200, 50)
e2 = ellipse (480,200, 50)
e3 = ellipse (325,300, 50)
e4 = ellipse (325,100, 50)
rotate(ang)
end

end
~~~
• Posts: 253
Can anyone tell me how to go about this, I cud use different shapes with the same approach, in Cinema 4D it’s easy, I haven’t figured how to do this Codea...Thanks to anyone & everyone...
• Posts: 253
I can get 1 ellipses to stay on the screen but not 4...

~~~
-- orbiting ellipse

displayMode(FULLSCREEN)
--======================
function setup()
ang=0

--........................................................
-- ( left, right, tip )
e1 = ellipse (100,100, 50)
--........................................................
end
--========================
function draw()
background(0)
--....................................................
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35) -- this is the wht highliteer
--......................................................
translate(WIDTH/2,HEIGHT/2)
rotate(ang)
e1 = ellipse (100,100, 50)
ang=ang+1
end
--====================
~~~
• Mod
Posts: 8,674
``````-- orbiting ellipse

displayMode(FULLSCREEN)
--======================
function setup()
ang=0
end
--========================
function draw()
background(0)
translate(WIDTH/2,HEIGHT/2)
rotate(ang)
ellipse (100,100, 50)
ellipse (-100,100, 50)
ellipse (100,-100, 50)
ellipse (-100,-100, 50)
ang=ang+1
end
``````
• Posts: 253
Cud anyone tell me why I’m not getting these triangles to spin in opposite directions ???
~~~

-- Rotating Triangles

displayMode(FULLSCREEN)
blendMode(OVERLAY)
--========================================
function setup()
ang=0
-- the vec points
a1=-120 -- right side x position
b1=-60 -- right side y position
c1= 100 -- left side x position
d1=-60 -- left side y position
e1=-10 -- tips x position
f1= 60 -- tips y position

a2=-120 -- right side x position
b2= 60 -- right side y position
c2= 100 -- left side x position
d2= 60 -- left side y position
e2= -10 -- tips x position
f2= -60 -- tips y position
--..............................................................
-- ( left, right, tip )
t1 = MakeTriangle (vec2(a1,b1), vec2(c1,d1), vec2(e1,f1), color(0, 0, 255))
t2 = MakeTriangle (vec2(a2,b2), vec2(c2,d2), vec2(e2,f2), color(0, 255, 0))
--...............................................................
end
--==========================================
function draw()
background(0)
--...............................................................
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35) -- this is the wht highliteer
--...............................................................
translate(WIDTH/2,HEIGHT/2)

pushMatrix()
rotate(ang)
t1:draw()
ang=ang+0.5
popMatrix()

pushMatrix()
rotate(ang)
t2:draw()
ang=ang-1
popMatrix()

end
--========================================
function MakeTriangle (v1, v2, v3, c)
m=mesh()
m.vertices={v1, v2, v3}
m:setColors(c)
return m
end

~~~
• Posts: 253
• Mod
Posts: 8,674

Give them different rotation angles.

``````-- Rotating Triangles

displayMode(FULLSCREEN)
blendMode(OVERLAY)
--========================================
function setup()
ang1=0
ang2=0
-- the vec points
a1=-120 -- right side x position
b1=-60 -- right side y position
c1= 100 -- left side x position
d1=-60 -- left side y position
e1=-10 -- tips x position
f1= 60 -- tips y position

a2=-120 -- right side x position
b2= 60 -- right side y position
c2= 100 -- left side x position
d2= 60 -- left side y position
e2= -10 -- tips x position
f2= -60 -- tips y position
--..............................................................
-- ( left, right, tip )
t1 = MakeTriangle (vec2(a1,b1), vec2(c1,d1), vec2(e1,f1), color(0, 0, 255))
t2 = MakeTriangle (vec2(a2,b2), vec2(c2,d2), vec2(e2,f2), color(0, 255, 0))
--...............................................................
end
--==========================================
function draw()
background(0)
--...............................................................
-- Draw a blue rect with light opacity to highlite the controls at the bottom
fill(0, 0, 255, 50) -- this fills the rect with blue
strokeWidth(1.5)
rect(6,3,265,35) -- this is the wht highliteer
--...............................................................
translate(WIDTH/2,HEIGHT/2)

pushMatrix()
ang1=ang1+0.5
rotate(ang1)
t1:draw()
popMatrix()

pushMatrix()
ang2=ang2-1
rotate(ang2)
t2:draw()
popMatrix()

end
--========================================
function MakeTriangle (v1, v2, v3, c)
m=mesh()
m.vertices={v1, v2, v3}
m:setColors(c)
return m
end
``````
• Posts: 253
Thanks !...