Как осуществить рисование на элементе canvas?

Возможно, у вас проблема с тем, что изображение рисуется до того, как оно полностью загружено. Попробуйте использовать событие onload изображения, чтобы убедиться, что оно полностью загружено перед рисованием:

```javascript
let img = new Image();
img.onload = function() {
    ctx.drawImage(img, x, y);
};
img.src = "path/to/img.jpg";
```

Также убедитесь, что значения `x` и `y` задают корректные координаты позиции рисования на canvas.

Если это не помогает, проверьте, нет ли ошибок в консоли браузера, которые могут помочь вам понять, в чем проблема.

const img = new Image();
img.src = "https://i.pinimg.com/originals/87/48/07/874807f8cb45e17f44312eb761261ad9.jpg";

img.onload = () => {
  const canvas = document.createElement('canvas');
  canvas.width = 500;
  canvas.height = 500;

  const ctx = canvas.getContext('2d');
  ctx.drawImage(img, 0, 0);

  document.body.append(canvas);
}; 

const img = new Image();
img.src = "https://i.pinimg.com/originals/87/48/07/874807f8cb45e17f44312eb761261ad9.jpg";

img.onload = () => {
  const canvas = document.createElement('canvas');
  canvas.width = 500;
  canvas.height = 500;

  const ctx = canvas.getContext('2d');
  ctx.drawImage(img, 0, 0);

  document.body.append(canvas);
};