On Tuesday morning (3/21) my flash drive crashed and I lost everything on there including my project, resume and other assignments for different classes. I originally created the BMW M logo but because I lost I decided to create another one. I decided to recreate the old school Playstation logo.
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var canvas = document.getElementById("
var context = canvas.getContext("2d");
//////////////////////////////
//middle shape
context.beginPath();
context.moveTo(300, 50);
context.quadraticCurveTo(460, 86, 500, 120);
context.quadraticCurveTo(579, 176, 545, 293);
context.quadraticCurveTo(517, 363, 445, 323);
context.lineTo(445, 148);
context.quadraticCurveTo(421, 105, 400, 130);
context.lineTo(400, 527);
context.lineTo(300, 500);
context.lineTo(300, 50);
context.closePath();
context.fill();
context.lineWidth = 4;
context.stroke();
//left shape
context.beginPath();
context.moveTo(200, 350);
context.lineTo(280, 323);
context.lineTo(280, 380);
context.lineTo(170, 425);
context.quadraticCurveTo(147, 451, 200, 448);
context.quadraticCurveTo(210, 450, 280, 423);
context.lineTo(280, 474);
context.quadraticCurveTo(227, 484, 200, 482);
context.quadraticCurveTo(74, 463, 68, 425);
context.quadraticCurveTo(53, 400, 200, 350);
context.closePath();
context.fill();
context.lineWidth = 4;
context.stroke();
//right shape
context.beginPath();
context.moveTo(420, 370);
context.quadraticCurveTo(500, 340, 600, 353);
context.quadraticCurveTo(750, 387, 650, 445);
context.lineTo(420, 525);
context.lineTo(420, 468);
context.lineTo(550, 423);
context.quadraticCurveTo(654, 384, 550, 387);
context.lineTo(420, 427);
context.lineTo(420, 370);
context.closePath();
context.fill();
context.lineWidth = 4;
context.stroke();
//////////////////////////////
};
</script>
</head>
<body>
<canvas id="myCanvas" width="800" height="600"></canvas>
</body>
</html>
No comments:
Post a Comment