Υποενότητα 8.2: p5.js Τα Βασικά

Βασικά σχήματα. Τρίγωνο - triangle()

triangle ()

Η συνάρτηση triangle() δέχεται 6 ορίσματα,  x1,y1,x2,y2,x3,y3. TΈτσι έχουμε τρίγωνο triangle(x1,y1,x2,y2,x3,y3).

Τα x1, x2 και x3 είναι αντίστοιχα οι συντεταγμένες x για το πρώτο, το δεύτερο και το τρίτο σημείο.

Τα y1, y2 και y3 είναι αντίστοιχα οι συντεταγμένες y για το πρώτο, δεύτερο και τρίτο σημείο.

Το τρίγωνο δημιουργείται συνδέοντας αυτά τα σημεία.

Ας δούμε ένα παράδειγμα ενός κώδικα που χρησιμοποιεί τη  triangle() function:

function setup() {
  // create canvas
  createCanvas(800,500);
  }
function draw () {
  // set background color
  background('orange');
  triangle(width/2,height/2,500,400,300,400);
  triangle(width/2,height/2,500,100,300,100);
}

Result of the above code:

Exercise

1. Open your Visual Studio editor and the p5yourName folder.
2. Open the file ex812.js in your editor and save it as ex827.js
3. Open the file ex812.html in your editor and save it as ex827.html
4. In the ex827.html file, update the link to ex827.js  from ex812.js
5. Go to the index.html file and create, under Module 8, a link to the ex827.html  file with the title "Primitives Shapes - triangle".

Modify the ex827.jsfile in order to create the abstract shape using triangles. You can see here an example.

Answer:

function setup() {
  // create canvas
  createCanvas(800,500);
  }
function draw () {
  // set background color
  background('orange');
  // create the shape using triangles
  triangle(400,250,500,400,300,400);
  triangle(300,100,400,250,200,250);
  triangle(500,100,600,250,400,250);
  triangle(400,250,200,250,300,400);
}

• Κάντε μια  Git commit με το μήνυμα "Primitives Shapes - triangle".

  • Δείτε περισσότερα για την triangle() function