CHANNELS:

All
P
Pietro posted 3 years ago
chris posted 3 years ago

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...
}
0
P
Pietro posted 3 years ago

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

1
Erbii posted a year ago

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

0

Want to participate?

Create a free Chris Courses account to begin

or
Sign In

Providing the lift to launch your development career

© 2024 Chris Courses. All rights reserved.