キャンバスに問題なく絵を描くことができます。しかし、新しいウィンドウのキャンバスに画像を描画したいと思います。変数には正しい値がありますが、それでも何も描画されません。
これが私のコードです：
var popup = window.open();
popup.oldCanvas= oldCanvas;
popup.url = 'http://www.html5canvastutorials.com/demos/assets/darth-vader.jpg';
popup.document.open();
popup.document.write("<html><head>");
popup.document.write('<script src="lib/jquery/jquery-2.1.1.min.js"></script>');
popup.document.write("<script>\n");
popup.document.write("$(document).ready(function() { \n");
popup.document.write(" function createCanvas() { \n");
popup.document.write(" var img = new Image;\n");
popup.document.write(" var newCanvas = document.createElement('canvas');\n");
popup.document.write(" var context = newCanvas.getContext('2d'); \n");
popup.document.write(" newCanvas.width = oldCanvas.width; \n");
popup.document.write(" newCanvas.height = oldCanvas.height; \n");
popup.document.write(" img.onload = function() {\n");
popup.document.write(" context.drawImage(this, 0, 0); \n");
popup.document.write(" }; \n");
popup.document.write(" img.src = url; \n");
popup.document.write(" }; \n");
popup.document.write(" createCanvas(); \n");
popup.document.write("}); \n");
popup.document.write("</script>");
popup.document.write("</head><body>");
popup.document.write("</body>");
popup.document.write("</html>");
popup.document.close();
新しいウィンドウに描画されていない場合でも同じコードが正常に機能するため、何が間違っているのか教えてください。
キャンバスは作成されますが、DOMに挿入されることはありません。
var newCanvas = document.createElement('canvas');
document.body.appendChild(newCanvas); // add to DOM
...
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加