HTML5 Canvas drawimage странное поведение ⇐ Html

[Anonymous]

Почему изображение в теге Canvas и теге img отличаются?
[img]https:/ /i.sstatic.net/UTLry5ED.png[/img]

Обратите внимание, что на изображениях тег img идеален, но тег Canvas показывает несколько ярких пикселей.
Я конвертировал JPG в BMP и PNG, проверил, проблема остается. Это мое тестовое изображение (это изображение было создано KIKO Software путем извлечения его из другого изображения, опубликованного в этом вопросе):


Простой код HTML:

Код: Выделить всё

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
const image = document.getElementById("scream");

image.addEventListener("load", (e) => {
ctx.drawImage(image, 0, 0, 300, 400);
});

Код: Выделить всё

[img]https://i.sstatic.net/6ktihBMk.png[/img]
Using tag img


Sorry, your browser does not support canvas.

Using tag canvas with drawImage

Подробнее здесь: https://stackoverflow.com/questions/793 ... e-behavior