Du bist nicht angemeldet.

Stilllegung des Forums
Das Forum wurde am 05.06.2023 nach über 20 Jahren stillgelegt (weitere Informationen und ein kleiner Rückblick).
Registrierungen, Anmeldungen und Postings sind nicht mehr möglich. Öffentliche Inhalte sind weiterhin zugänglich.
Das Team von spieleprogrammierer.de bedankt sich bei der Community für die vielen schönen Jahre.
Wenn du eine deutschsprachige Spieleentwickler-Community suchst, schau doch mal im Discord und auf ZFX vorbei!

Werbeanzeige

1

08.06.2012, 13:06

JavaScript - Bild wird nicht gezeichnet.

Hallo Leute, wie einige wissen habe ich Gestern mit JavaScript angefangen und alles nach einem Tutorial gemacht was ich Jetzt wohl bereue :dash: Ich hab Gestern nach dem Tutorial beschlossen mal alles nach Frei Schnauze zu machen ... hat auch alles Funktioniert.. canvas etc waren keine Probleme allerdings möchte sich das Bild nicht Zeichnen lassen...

Hier mal der Quellcode:

Javascript-Quelltext

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var canvasBg = document.getElementById('canvasBg');
var ctxBg = canvasBg.getContext('2d');

var imageSprite = new Image();
imgSprite.addEventListener('load', init, false);

var gameWidth = 800;
var gameHeight = 600;

function init(){
    drawBg();
}

function drawBg(){
    bg = imageSprite.src = "images/bg.png";
    
    ctxBg.drawImage(bg, 0, 0);
}

idontknow

unregistriert

2

08.06.2012, 13:55

Gekuckt ob die Pfadangabe deines Bildes stimmt? Notfalls zum Test mal absolute Pfade verwenden.

3

08.06.2012, 13:57

Der Pfad stimmt.. Meine Vermutung liegt wohl eher bei den Koordinaten oder so..

idontknow

unregistriert

4

08.06.2012, 14:01

Nächste Vermutung: Image hat kein "addEventListener". Woher hast du das? Hab mal kurz gegoogled wenn ich das richtig sehe ist das eine Methode vom Canvas nicht vom Image.

5

08.06.2012, 14:05

Javascript-Quelltext

1
imgSprite.addEventListener('load', init, false);


Hier Lädt er das aus der Funktion init während die Seite Lädt :thumbup:

Mein ich zumindest..

idontknow

unregistriert

6

08.06.2012, 17:19

Meinst du, aber IST das so? ich hab auf die schnelle nichts gefunden außer einem Kommentar der besagt, dass eben diese Methode addEventListener zu dem Canvas Objekt gehört und nicht zu dem Image.

7

08.06.2012, 17:34

Oh Man :S JavaScript und ich werden wohl irgendwie keine Freunde :rolleyes:

idontknow

unregistriert

8

08.06.2012, 17:52

Was hat das damit zu tun, das Problem ist vermutlich das selbe wie bei jeder Programiersprache: du rufst eine Methode auf einer Klasse auf die diese Methode nicht hat. Das hat rein gar nichts mit Javascript zu tun.

9

08.06.2012, 18:01

Ich hab jetzt diesen Code:

Javascript-Quelltext

1
2
3
4
5
6
7
8
9
10
var canvasBg = document.getElementById('canvasBg');
var ctxBg = canvasBg.getContext('2d');

var imgSprite = new Image();
imgSprite.addEventListener('load', drawBg, false);

function drawBg(){
    bg = imgSprite.src = "images/bg.png";
    ctxBg.drawImage(bg, 0, 0);
}


Und wenn ich bei Google Chrome auf Element untersuchen Gehe -> Console dann Steht da "Uncaught TypeError: Cannot call method 'getContext' of null"

xardias

Community-Fossil

Beiträge: 2 731

Wohnort: Santa Clara, CA

Beruf: Software Engineer

  • Private Nachricht senden

10

08.06.2012, 18:11

Dann scheint es das Element mit der ID 'canvasBg' nicht zu geben!

Werbeanzeige