どうすりゃ良いのか調査中
FirefoxだとvideoタグからvideoWidth,videoHeightで行けそうなサンプルコードがMDNに あったが、Chromeはダメダメだった。(Firefoxは未検証)
- videoWidth,videoHeight
- window.devicePixelRatio
- screen.width,screen.height
バイナリデータからリンクを作れるわけだが
blobにしてから利用する必要がある。
var http = new XMLHttpRequest();
//open メソッド
var fileName = COMPRESSED_WEBRUBY_URL;
var data = "";
http.open("GET", fileName, true);
http.responseType = "arraybuffer";
//受信時に起動するイベント
http.onreadystatechange = function () {
//readyState値は4で受信完了
if (http.readyState == 4) {
var decompressed = zlib.inflate(new Uint8Array(http.response));
var blob = new Blob([decompressed.buffer]);
var url = URL.createObjectURL(blob);
var script = document.createElement('script');
script.src = url;
if (i++ < numScripts) {
script.onload = function () {
URL.revokeObjectURL(url);
appendScripts();
};
} else {
script.onload = callback;
}
//console.log(decompressed.toString);
document.body.appendChild(script);
}
};
//send メソッド
http.send(data);
var base64 = canvas.toDataURL();
var binData = atob(base64.replace(/^.*,/, ''));
var buffer = new Uint8Array(binData .length);
for (var i = 0; i < binData .length; i++) {
buffer[i] = binData.charCodeAt(i);
}
- DataURLを入力して画像を表示する
- toDataUrlしたイメージを表示する
- rainyday.jsを試してみた
- カメラロールの写真を魚眼レンズ風にする
- forked: z-indexを試す
- いろんな種類を指定してglobalCompositeOperationを試した
- CanvasにHTMLを描画する?!
- 任意のURLの画像を魚眼レンズ風に表示する
- iframeをcanvasで覆う