コンソールに画像を無理やり表示させてみた

Chromeのコンソールで色付きで出力されているサイトを見かけた.

やってみたかったので,ちょっと調べたらCSSで色が変えられるらしい.

そこでふと,「画像のピクセル読んで表示できんじゃね?」って思い立ったので作ってみた.

追記:Chromeでしか動かない

追追記:先人がいた

自分のほうはconsoleっぽさ重視ってことでひとつ

コンソールに無理やり画像を出力する

このページに埋め込んでみたので,コンソールを開いてみてほしい.

(最新版のChromeだけ動作確認.)

追記:Chromeでしか動かない

使用する際,CrossDomain制約には気をつけなければならない.

画像は下のURLから拝借した.

miku

追追追記:動画も対応してみた

// Youtube開いてコンソールで実行してみる
setInterval(function(){console.drawImage($('video'), 50, false);}, 500);