"TEST IM314 Canvas"
Bootstrap 3.3.0 Snippet by mrose6

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <h2>Learning the Canvas</h2> <canvas id="myCanvas" width="600" height="600"></canvas> <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); //circle var x = 330; var y = 250; var radius = 220; var startAngle = 1 * Math.PI; var endAngle = 4 * Math.PI; var counterClockwise = false; context.beginPath(); context.arc(x, y, radius, startAngle, endAngle, counterClockwise); context.lineWidth = 15; context.fillStyle = '#8ED6FF'; context.fill(); // line color context.strokeStyle = 'black'; context.stroke(); // do cool things with the context context.font = '40pt Apple Chancery'; context.fillStyle = 'red'; context.fillText('Goodbye World!', 150, 250); //linr context.lineWidth = 1; context.beginPath(); context.moveTo(150, 250); context.lineTo(500, 250); context.stroke(); </script> </div> </div>
body { margin: 0px; padding: 0px; }

Related: See More


Questions / Comments: