0

my code is

  var stone = new Image(20, 20);

  var grass = new Image(20, 20);

  var dirt = new Image(20, 20);
  
  stone.id = 'stone' ;
  stone.src = 'stone.png';  
  dirt.src = 'dirt.png';
  dirt.id = 'dirt' 
  grass.src = 'grass.png'; 
  grass.id = 'grass'`

and I want to make it so the rest of my code will run after all these images have loaded because as it is now, the images dont get loaded in and when I use them in the HTML Canvas they don't show up

Mitya
  • 33,629
  • 9
  • 60
  • 107
Striker X
  • 1
  • 1
    Welcome to SO. Did you try anything? – Mitya Jan 25 '21 at 17:13
  • I have tried several things and keep getting this error Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)' – Striker X Jan 25 '21 at 18:37
  • Does this answer your question? [Loading images before rendering JS canvas](https://stackoverflow.com/questions/61336830/loading-images-before-rendering-js-canvas) – ggorlen Jan 25 '21 at 19:42
  • See also [Images onload in one function](https://stackoverflow.com/questions/58527416/images-onload-in-one-function/58529126#58529126) – ggorlen Jan 25 '21 at 19:43

0 Answers0