Reputation: 572
Having some trouble with a HTML5/Javascript canvas code snippet. Please see below for the relevant sections. The two squares and the line show up without issue - but the circle/arc does not.. Why is this?! Something wrong with my "arc" code?... Thanks.
HTML file:
<section id="main">
<canvas id="canvas" width="600" height="400">
Requires modern browser.
</canvas>
<!-- START JAVASCRIPT -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script>
<script src="js/canvas.js"></script>
<script>
$(document).ready(function() {
CV.initialize();
});
</script>
Javascript file:
CV.initialize = function()
{
console.log('start');
cv = $('#canvas')[0];
canvas = cv.getContext('2d');
canvas.beginPath();
canvas.arc(200, 200, 150, Math.Pi, 0, false);
canvas.closePath();
canvas.stroke();
canvas.strokeStyle = "blue";
canvas.strokeRect(10, 10, 50, 50);
canvas.fillRect(100, 100, 150, 150);
canvas.beginPath();
canvas.moveTo(300,300);
canvas.lineTo(400,350);
canvas.closePath();
canvas.stroke();
};
Upvotes: 0
Views: 999