I'm trying to Draw a Canvas using JavaScript ... but it's not working .. Can anybody help me on this? ..I'm trying to Build a Flappy bird with HTML 5 and JavaScript .. but this Code is not Working ..
Pastebin Code: http://pastebin.com/uEXVx89k
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<title>FlappyJS</title>
<script src="sprite.js"></script>
<style>
canvas {
display: block;
position: absolute;
margin: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
</style>
</head>
<body>
<script type="text/javascript" src="sprite.js"></script>
<script>
var canvas,
ctx,
width,
height,
frames = 0,
score = 0,
best = 0,
currentstate,
states = {
Splash:0 , Game: 1 ,Score:2
},
bird = {},
pipes = {};
function main(){
canvas = document.createElement("canvas");
width = window.innerWidth;
heigth = window.innerHeight;
if (width >= 500) {
width = 320;
heigth = 480;
canvas.style.border = "1px solid #000";
}
canvas.width = width;
canvas.height = height;
ctx = canvas.getContext("2d");
document.body.appendChild(canvas);
}
function run(){
}
function update(){
}
function render(){
}
main();
</script>
</body>
</html>
Note: I'm a Noob in JavaScript .
我需要绘制一个 Canvas ,如图
最佳答案
这是一个正在运行的 JSFiddle:http://jsfiddle.net/jwmnvn04/
您有一个拼写错误。
首先你这样声明:
heigth = window.innerHeight;
然后(我猜仍然正确,尽管上下文拼写错误):
heigth = 480;
但是当你调用它来确定 Canvas 的高度时,你可以正确拼写它:
canvas.height = height;
关于javascript - 绘制 Canvas 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27088485/