how to fill a triangle with diagonal lines?

General Discussion Other

liyinicole

how to fill a triangle with diagonal lines?

in General Discussion • Other • 3 months ago

Hi everyone,

I am just starting with Processing ( I am a girl with life science background and this is my first time coding).

I am reading the book' getting started with processing' and doing some exercises on my own. I have a very silly question to ask you, how do you fill a triangle with diagonal lines? ( i dont want to just set the background to black to cover the lines outside the triangle)

Thanks

Nicole

Replies(4)

Makio135

Re: how to fill a triangle with diagonal lines?

3 months ago

let's say you have a triangle:

Copy code

triangle(x1,y1, x2,y2, x3,y3);

you can do:

Copy code

int nbLines = 12;//number of lines desired
for(int i=0; i<nbLines; i++){
float xa = map(i,0,nbLines, x1, x3);
float ya = map(i,0,nbLines, y1, y3);
float xb = map(i,0,nbLines, x2, x3);
float yb = map(i,0,nbLines, y2, y3);
line(xa,ya, xb,yb);
}

Makio135
http://makio135.com/

Makio135

Re: how to fill a triangle with diagonal lines?

3 months ago

full example:

Copy code

float x1,y1, x2,y2, x3,y3, nbLines;
void setup(){
size(800, 600, P2D);
smooth();
randomize();
}
void draw(){
background(255);
triangle(x1,y1, x2,y2, x3,y3);
for(int i=0; i<nbLines; i++){
float xa = map(i,0,nbLines, x1, x3);
float ya = map(i,0,nbLines, y1, y3);
float xb = map(i,0,nbLines, x2, x3);
float yb = map(i,0,nbLines, y2, y3);
line(xa,ya, xb,yb);
}
noLoop();
}
void mousePressed(){
randomize();
loop();
}
void randomize(){
x1= random(width);
y1=random(height);
x2= random(width);
y2=random(height);
x3= random(width);
y3=random(height);
nbLines = random(15);
}

Makio135
http://makio135.com/

amnon.owed

Re: how to fill a triangle with diagonal lines?

3 months ago

An alternative option is to draw the lines to a PGraphics and use that as a texture on a polygon (in this case a triangle). Also see this thread.

Code Example (compatible with Processing 1.5.1 & 2.0.1)

Copy code

import processing.opengl.*;
int numLines = 100;
float angle = 45;
PGraphics pg;
void setup() {
size(500, 500, OPENGL);
pg = createGraphics(width, height, JAVA2D);
drawLines(pg, angle, numLines);
}
void draw() {
background(255);
// drawLines(pg, frameCount%360, numLines); // rotating lines
drawTriangle(mouseX, mouseY, 450, 300, 200, 450, pg);
}
void drawLines(PGraphics pg, float angle, int num) {
pg.beginDraw();
pg.smooth();
pg.background(0, 0);
pg.translate(pg.width/2, pg.height/2);
pg.rotate(radians(angle));
float w = pg.width*1.5/num;
for (int i=0; i<num; i++) {
float x = (i-num/2)*w;
pg.line(x, -pg.height, x, pg.height);
}
pg.endDraw();
}
void drawTriangle(float x1, float y1, float x2, float y2, float x3, float y3, PGraphics tex) {
beginShape();
texture(tex);
vertex(x1, y1, x1, y1);
vertex(x2, y2, x2, y2);
vertex(x3, y3, x3, y3);
endShape(CLOSE);
}

liyinicole

Re: how to fill a triangle with diagonal lines?

3 months ago

thank you !

Top Reply