我试过搜索这样的东西,但我一直没找到。我正在尝试打开一个新选项卡,其中包含webgl图像当前状态的屏幕截图。基本上,它是一个3d模型,可以更改显示的对象、对象的颜色和背景颜色。目前,我正在使用以下内容:
var screenShot = window.open(renderer.domElement.toDataURL("image/png"), 'DNA_Screen');
这一行成功地打开了一个带有我的模型的当前图像的新选项卡,但不显示当前的背景色。它也不能正确显示选项卡名称。相反,选项卡名始终是"PNG 1024x768“。
有没有办法改变我的window.open,让背景颜色显示出来?正确的标签名称也很好,但背景颜色是我最关心的问题。
发布于 2013-05-09 03:03:24
如果在没有URL的情况下打开窗口,则可以直接从打开窗口的JavaScript访问整个DOM。
var w = window.open('', '');
然后,您可以设置或添加所需的任何内容
w.document.title = "DNA_screen";
w.document.body.style.backgroundColor = "red";
并添加屏幕截图
var img = new Image();
img.src = someCanvas.toDataURL();
w.document.body.appendChild(img);
发布于 2013-05-08 13:55:48
它比你的单行要长得多,但是你可以改变上下文矩形的背景颜色。
printCanvas (renderer.domElement.toDataURL ("image/png"), width, height,
function (url) { window.open (url, '_blank'); });
// from THREEx.screenshot.js
function printCanvas (srcUrl, dstW, dstH, callback)
{
// to compute the width/height while keeping aspect
var cpuScaleAspect = function (maxW, maxH, curW, curH)
{
var ratio = curH / curW;
if (curW >= maxW && ratio <= 1)
{
curW = maxW;
curH = maxW * ratio;
}
else if (curH >= maxH)
{
curH = maxH;
curW = maxH / ratio;
}
return { width: curW, height: curH };
}
// callback once the image is loaded
var onLoad = function ()
{
// init the canvas
var canvas = document.createElement ('canvas');
canvas.width = dstW;
canvas.height = dstH;
var context = canvas.getContext ('2d');
context.fillStyle = "black";
context.fillRect (0, 0, canvas.width, canvas.height);
// scale the image while preserving the aspect
var scaled = cpuScaleAspect (canvas.width, canvas.height, image.width, image.height);
// actually draw the image on canvas
var offsetX = (canvas.width - scaled.width ) / 2;
var offsetY = (canvas.height - scaled.height) / 2;
context.drawImage (image, offsetX, offsetY, scaled.width, scaled.height);
// notify the url to the caller
callback && callback (canvas.toDataURL ("image/png")); // dump the canvas to an URL
}
// Create new Image object
var image = new Image();
image.onload = onLoad;
image.src = srcUrl;
}
https://stackoverflow.com/questions/16431318
复制相似问题