three.js导出场景为图片

three.js导出场景为图片是一个常用的功能

1.如果只是普通形式的导出可以采用a标签的形式。

 function downloadImage(imgUrl){

        var a = $("<a></a>").attr("href", imgUrl).attr("download", "3dMap.png").appendTo("body");

        a[0].click();

        a.remove();

    }

renderer.render(scene,camear);

let imgData = renderer.domElement.toDataURL("image/jpeg");

downloadImage(imgData);

2.带有CSS2DRenderer导出

采用第一种形式只能导出canvas内容，但是如果带有CSS2DRenderer内容是没有导出的。可以采用html2canvas(https://html2canvas.hertzen.com/)形式

html2canvas($("#container").get(0)).then(function(canvas) {

var myDate=new Date();

var getTime = myDate.getTime();

let imgData = canvas.toDataURL("image/jpeg");

let a = $("<a></a>").attr("href", imgData).attr("download", "innojoy_"+getTime+".jpeg").appendTo("body");

a[0].click();

a.remove();

});     

完美导出canvas和CSS2DRenderer；