JSFiddle - React, Tailwind, and code Playground
HTML
<canvas id="canvas" width="400" height="300"></canvas>
CSS
#canvas{
border : 1px dashed red;
}
JavaScript
function Points(x,y);
this.x = x;
this.y = y;
}
function Line(p1,p2){
this.x = x;
this.y = y;
}
function Poligon(p1,p2,p3/*,..pn*/){
this.lines = [];
for(i = 0;i < arguments.length-1;i++){
this.lines.push(new Line(arguments[i], arguments [i+1]));
}
this.lines.push(new Line(arguments[i], arguments[arguments.length-1]))
}
Polygon.prototype.draw = function(){
for(i = 0 ; i <= this.lines.length; i++){
arguments[i].draw();
}
}
var p1 = new Point(0, 0),
p2 = new Point(10,100),
p3 = new Point( 200,20);
var x = new Polygon(new Point(30,80),50,90);
x.draw();