ASCII In Class Assignment
Today in class we were tasked with making a heart using html5. After 20 minutes of utter frustration I accomplished this lovely doodad. It's not exactly what I envisioned but at least its heart shaped-ish
CODE:
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ
var startx = 400;
var starty = 275;
var controlx1 = 200;
var controly1 = 100;
var controlx2 = 250;
var controly2 = 400;
var endx2 = 400;
var endy2 = 475;
var controlx3 = 550;
var controly3 = 400;
var controlx4 = 600;
var controly4 = 100;
var endx3 = 400;
var endy3 = 275;
context.beginPath();
context.moveTo(startx, starty);
context.bezierCurveTo(controlx1, controly1, controlx2, controly2, endx2, endy2);
context.bezierCurveTo(controlx3, controly3, controlx4, controly4, endx3, endy3);
context.fillStyle = 'rgb(255, 51, 153)';
context.fill();
context.lineWidth = 15;
context.closePath();
context.stroke();
////////////////////////////////////// end above this line ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ
};
</script>
</head>
<body>
<canvas id="myCanvas" width="800" height="600"></canvas>
</body>
</html>
No comments:
Post a Comment