2012-08-26 101 views
0

我正在学习HTML5,无法在屏幕上显示任何内容。它只是完全白色。所有的代码如下。Can not get HTML5 Canvas to Work

HTML:

<head> 
<script src="canvas.js"></script> 

</head> 
<body> 
<section id="main"> 
    <canvas id="canvas" width="600" height="400"> 
     Get Chrome 
    </canvas> 
</section> 
</body> 
</html> 

的JavaScript

function doFirst(){ 
var x = document.getElementById('canvas'); 
canvas = x.getContext('2d'); 

canvas.shadowOffsetX = 4; 
canvas.shadowOffsetY = 4; 
canvas.shadowBlur = 6; 
canvas.shadowColor = 'rgba(0,0,255,.5)'; 

canvas.font="36px Tahoma"; 
canvas.textAlign="end"; 
canvas.strokeText("omgjj", 300, 500); 
} 
window.addEventListener("load", doFirst, false); 
+1

顺便说一句,你忘了申报'canvas'。 ('var canvas = ...') –

回答

1

你Y坐标是关闭的画布。更改此:

canvas.strokeText("omgjj", 300, 500); 

要这样:

canvas.strokeText("omgjj", 300, 200); 

而且你的文字会出现:
A screenshot of the canvas, displaying the text 'omgjj', stroked, with a bluish drop shadow

+0

谢谢!我没有注意到这一点 – user1626508