通过监听事件监听截图按钮,根据我的代码或者查看开源代码进行使用或修改!
data(){
return{
url:'',
viewer:window.viewer,
scene:viewer.scene,
}
},
methods: {
// 截图
screenshotClick() {
var promise = this.scene.outputSceneToFile();
Cesium.when(
promise,
(base64data)=> {
this.download(base64data);
}
);
},
/**
* 根据图片生成画布
*/
convertImageToCanvas(image) {
var canvas = document.createElement("canvas");
canvas.width = image.width;
canvas.height = image.height;
canvas.getContext("2d").drawImage(image, 0, 0);
return canvas;
},
/**
* 下载图片
*/
download(base64data) {
var image = new Image();
image.src = base64data;
console.log(image.src,'image');
image.onload = ()=> {
var canvas = this.convertImageToCanvas(image);
this.url = canvas.toDataURL("image/jpeg");
var a = document.createElement("a");
var event = new MouseEvent("click");
a.download = new Date().getTime() + ".jpg"; // 指定下载图片的名称
a.href = this.url;
a.dispatchEvent(event); // 触发超链接的点击事件
};
},
}
希望可以对老铁们有所帮助!
开源地址:https://iserver.supermap.io/iserver/iClient/for3D/webgl/zh/examples/webgl/editor.html#outputScene