我使用HTML5 Canvas在Animate CC中制作了一个装扮游戏。最后,用户可以将角色另存为图像。
我的问题是如何在游戏中添加此图像。
首先,我只是创建了一个链接,该链接将出现在游戏下方(个展,该人需要向下滚动才能看到该链接;如果嵌入了链接,我不确定它如何工作,所以我尝试过的替代方法)。而且因为它可能会造成混淆,所以我还创建了一个警报框。
我现在设法使该图像在新窗口中自动打开,效果更好-但是,由于打开了空白窗口,因此在Chrome中不起作用。
所以我想知道是否还有另一种/更好的方法来做到这一点??
理想情况下,最好在游戏中触发一个对象,该对象将出现在“保存图像”按钮附近,其中可能包含链接(或与用户保存的链接一样多)。但是我对编程知识不甚了解。
这是当前代码:
var hiddenCanvas = document.createElement('canvas');
hiddenCanvas.width = canvas.width * 0.388;
hiddenCanvas.height = canvas.height;
var canvasContext = hiddenCanvas.getContext('2d');
canvasContext.drawImage(
canvas,
0,
0,
canvas.width * 0.388,
canvas.height,
0,
0,
canvas.width * 0.388,
canvas.height);
var aTag = document.createElement('a');
aTag.setAttribute('href', hiddenCanvas.toDataURL("image/png"));
aTag.innerHTML = "Criámos uma imagem do teu Doutor. Salva-a aqui! :O)";
aTag.download = "ONV_oTeuDoutor.png";
window.open(aTag);
答案 0 :(得分:0)
您可以使用以下方法随时捕获Canvas的屏幕截图:
var src = canvas.toDataURL();
var image = document.createElement('img');
image.src = src;
然后您可以使用:-
将其添加到DOM中。document.body.appendChild(image);