Javascript - получить данные пикселей из изображения под элементом холста?

Question

Вы можете сэмплировать данные цвета пикселя на изображении холста с помощью getImageData (). Если я наложу прозрачный элемент холста на фоновое изображение или флэш-фильм, могу ли я сэмплировать цвет с помощью тега canvas?

Answer 1

Фил прав, ты не можешь этого сделать. Canvas по своему дизайну возвращает только свои собственные данные пикселей, а не какой-либо отображаемый на экране контент, происходящий из других элементов.

Вы можете создать элемент canvas, который охватывает всю страницу и захватывает изображение отображаемого экрана.

Если возможно, это будет дыра в безопасности межсайтового скриптинга. Вы можете создать целевой сайт (используя куки-файлы / аутентификацию / интранет для доступа пользователей к нему), а затем высасывать контент из него попиксельно.

Answer 2

Я думаю, что нет. Вы бы получили цвет холста в этой точке. Я нашел метод document.defaultview.getComputedStyle(element,pseudoElt), но на 1-пиксельном делении без цвета фона он возвратил «прозрачный».

Так что, к сожалению, это может быть невозможно в настоящее время. Какова ваша цель более высокого уровня? Возможно, мы сможем найти альтернативный маршрут.

"У меня ранее была идея скопировать данные изображения в объект javascript. Вы можете создать элемент canvas, который будет покрывать всю страницу и захватывать изображение отображаемого экрана. Получив эти данные, вы сможете создавать в реальном мире возможно, кросс-браузерное тестирование. "

Если вы не возражаете, что это статичное изображение, есть отличный сайт, который сделает это за вас: Браузерные снимки . Он генерирует скриншоты вашего сайта в разных браузерах.