Question

我正在学习HTML5，并且无法在屏幕上显示任何内容。它只是完全白色。所有代码都在下面。

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);

Answer 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

无法使HTML5 Canvas工作

1 个答案: