Холст всегда равен нулю

У меня есть повторяющаяся проблема. Всякий раз, когда я пытаюсь получить доступ к 2d-контексту моего элемента canvas (уже в моем html), чтобы нарисовать изображение, я получаю консольную ошибку, сообщающую мне, что я не могу нарисовать нулевое значение. (Невозможно вызвать метод drawImage null) Я нахожусь на третьем переписывании, запущенном в JS сейчас в jquery. Пробовал перемещать скрипты в html. Я не понимаю. Наверняка элемент холста уже существует, потому что DOM готов?Холст всегда равен нулю

$(document).ready(function(){ 

function setup(){ 

var canvas = document.getElementById("canv1"); 
console.log(canvas.toString()); 
//this grabs hold of the canvas api 
var canvcontext = canvas.getContext('2D'); 
console.log(canvcontext.toString()); 


burpy = new Image(); 
burpy.onload = canvcontext.drawImage(burpy,400,100); 
burpy.src = 'burpy.png'; 
}; 


setup(); 
});

HTML-

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd" 
    > 
<html lang="en"> 
<head> 
    <title>JAVASCRIPT TEST</title> 
<link rel="stylesheet" href="styles.css" type="text/css"> 

<script src="jquery.js" type="text/javascript"></script>  
<script src="parse.js" type="text/javascript"></script>  
</head> 
<meta http-equiv="Content-Script-Type" content="text/javascript"> 
<body id="body"> 
    Silly video games 
    <br>  

<canvas id="canv1" width="200" height="100" 
style="border:1px solid #000000;"></canvas> 

<div id="canvwrap"> 

</div> 
</body> 
</html>

Пожалуйста, помогите!

источник

2013-04-10 KolKurtz

Попробуйте canvas.getContext('2d'); вместо canvas.getContext('2D');

источник

2013-04-10 14:19:50 Chris

+1 Бей меня к нему - он чувствителен к регистру! Вот доказательство: http://jsfiddle.net/WXUSg/ – Fenton

Я собираюсь пойти и броситься к стене. Большое спасибо за этот ответ. Думаю, ты был прав. Теперь я получаю контекст в моей переменной. – KolKurtz

Pls mark как правильный ответ, если возможно (: – Chris

ответ

Смежные вопросы