Zielony Smok

HTML5 canvas – tutorial

Point – kształty

Użyty został skrypt figures.js.

Zawartość możesz zobaczyć w
przeglądarce obsługującej element <canvas>
z kontekstem "2d"


Listing

var cv = document.getElementById("canvas");
var ctx = cv.getContext("2d");
//-
var point = new Point(120, 20);
point.strokeStyle = "blue";
point.shape="cross";
point.stroke = true;
point.lineWidth = 0.5;
point.diam = 10;
point.draw(ctx);
//
var point1 = new Point(150, 50);
point1.fillStyle="red";
point1.strokeStyle = "blue";
point1.fill = true;
point1.stroke = true;
point1.lineWidth = 1.0;
point1.diam = 6;
point1.draw(ctx);
//
var point2 = new Point(110, 70);
point2.fillStyle="green";
point2.strokeStyle = "blue";
point2.shape="square";
point2.fill = true;
point2.diam = 8;
point2.draw(ctx);