I’m working on making a basic web application using canvas that dynamically changes the canvas size when the window resizes. I’ve gotten it to work statically without any flaws but when I create an object to make it dynamically it throws an error
in chrome the error is:
Uncaught TypeError: Object [object Object] has no method ‘getContext’
and in firefox it is:
this.element.getContext is not a function
I’ve searched the web and it seems like a common problem but none of the fixes mentioned make any difference.
Я пытаюсь анимировать шар, который следует за курсором в Javascript, используя элемент canvas. Я передать ссылку на мой объект холста функции с именем followMouse, но когда я пытаюсь получить его контекст, поджигатель дает мне эту ошибку:
TypeError: canvas.getContext is not a function
Когда я вхожу ссылку холст на консоль, он отображает холст элемент. Я не знаю, почему тогда я не могу получить контекст в функции. Кто-нибудь знает, что происходит?
ли элемент с идентификатором ‘main’ действительно холст элемент? Помните, что идентификаторы должны быть уникальными. – Felix Kling 17 окт. 12 2012-10-17 20:23:20
Да, это так. Как я уже сказал, он отображается в консоли при регистрации. – SheedySheedySheedy 17 окт. 12 2012-10-17 20:26:33
Ваше использование window.requestAnimFrame странно. Разве вы не должны устанавливать обратный вызов? Если вы настроили обратный вызов, уверены ли вы, что он предоставляет canvas в качестве первого аргумента? – Denys Séguret 17 окт. 12 2012-10-17 20:28:46
@dystroy Не ‘followMouse’ обратный вызов? – Kendall Frey 17 окт. 12 2012-10-17 20:30:43
@dystoy Действительно: обратный вызов window.requestAnimationFrame [предоставляется временная метка числа] (https://developer.mozilla.org/en-US/docs/DOM/window.requestAnimationFrame#Notes) в качестве первого аргумента. – apsillers 17 окт. 12 2012-10-17 20:33:33
1 ответ
Ваша линия window.requestAnimFrame(followMouse, canvas); называет followMouse(timestamp) , где метка времени является число передается функции обратного вызова, когда он уволен requestAnimationFrame . Это приводит к вызову timestamp.getContext , что явно недействительно.
Вместо этого обернуть вызов внутри анонимной функции:
Создан 17 окт. 12 2012-10-17 20:30:32 apsillers
Это избавляет от ошибки. Благодарю. – SheedySheedySheedy 17 окт. 12 2012-10-17 20:37:06
Сисадмин, программист, делюсь опытом
Проблема «getContext is not a function» наблюдается, если canvas создаётся динамически, или просто сразу не имеет id, когда хотим получить от него getContext (2d).
Рабочее решение при использовании jQuery:
Здесь SomeClass — класс, присвоенный canvas без id, всё отработает без ошибок