Hey Pietro - give the following code a go:
const canvas = document.querySelector('canvas');
const c = canvas.getContext('2d')
const image = new Image()
image.src = './myImage.jpg'
image.onload = () => {
c.drawImage(image, 0, 0)
}
As long as your image is referenced correctly, it should display on the canvas.
Also, by including the c.drawImage()
function within your game's animation loop, it should show continuously without it getting overwritten when you start your game:
function animate() {
c.drawImage(image, 0, 0)
// the rest of your animate code here...
}
Thank you Chris!
My error was to include the c.drawImage(image, 0, 0)
method inside the init()
function.
Also, I have to say, you are so great at explaining things. Your videos are not just a follow along, they are filled of precious information on how JS works and how to code.
Please keep your content this level for the future!
Thank you again,
Pietro
Hello Chris,
The background image is working, but my player won't show when there's the background image.
Do you have any solutions ? How to fix it ?
Thank you Chris for what you doing for us (Beginners).
Erbii
Want to participate?
Create a free Chris Courses account to begin