Javascript 您能建议导出服务器映像的任何解决方案吗?(如OSM)
我已尝试将OSM图像导出为.png或.jpeg格式。我无法导出服务器映像。我附上了一个OSM图像的简单样本。任何人都尽力解决上述问题。请参阅下面的stackblitz示例 样本-Javascript 您能建议导出服务器映像的任何解决方案吗?(如OSM),javascript,html,css,export,openstreetmap,Javascript,Html,Css,Export,Openstreetmap,我已尝试将OSM图像导出为.png或.jpeg格式。我无法导出服务器映像。我附上了一个OSM图像的简单样本。任何人都尽力解决上述问题。请参阅下面的stackblitz示例 样本- document.getElementById('Export').onclick = function() { var foreign = document.createElementNS( "http://www.w3.org/2000/svg", "foreignObject
document.getElementById('Export').onclick = function() {
var foreign = document.createElementNS(
"http://www.w3.org/2000/svg",
"foreignObject"
);
var annoationElement = document.getElementById("tiles");
foreign.innerHTML = annoationElement.outerHTML;
annoationElement.style.display = "none";
var svg = document.querySelector("#svgtitle");
svg.appendChild(foreign);
var svgData = new XMLSerializer().serializeToString(svg);
var canvas = document.createElement("canvas");
document.body.appendChild(canvas);
var svgSize = svg.getBoundingClientRect();
canvas.width = svgSize.width;
canvas.height = svgSize.height;
var ctx = canvas.getContext("2d");
var img = document.createElement("img");
img.setAttribute(
"src",
"data:image/svg+xml;base64," + btoa(unescape(encodeURIComponent(svgData)))
);
img.onload = function() {
ctx.drawImage(img, 0, 0);
var imagedata = canvas.toDataURL("image/png");
var anchor = document.createElement("a");
debugger
anchor.download = "OSM.png";
debugger
anchor.href = imagedata;
document.body.appendChild(anchor);
anchor.click();
canvas.remove();
};
}