[英]Html2canvas - capture google map to image in phonegap application
I want to capture google map with overlays to an image for future uses. 我想用图像覆盖叠加的谷歌地图,以备将来使用。 I just tried with html2canvas, like
我刚刚尝试了html2canvas
html2canvas($('#map'), {
useCORS: true,
onrendered: function(canvas) {
document.body.appendChild( canvas );
}
});
This works fine on desktop browsers like chrome & FF. 在chrome和FF之类的桌面浏览器上可以正常工作。 However in phonegap app it just creates the image with map zoom buttons etc. But map tiles are missing.
但是,在phonegap应用程序中,它仅使用地图缩放按钮等创建图像。但是缺少地图图块。 Just map controlls are there.
只是地图控件在那儿。
Got it.. :) 得到它了.. :)
add allowTaint:true
添加
allowTaint:true
html2canvas($('#map'), {
useCORS: true,
allowTaint:true,
onrendered: function(canvas) {
document.body.appendChild( canvas );
}
});
This is the function I've used: 这是我使用的功能:
function convertasbinaryimage() {
html2canvas(document.getElementById("map"), {
useCORS: true,
onrendered: function (canvas) {
var img = canvas.toDataURL("image/png");
img = img.replace('data:image/png;base64,', '');
var finalImageSrc = 'data:image/png;base64,' + img;
$('#googlemapbinary').attr('src', finalImageSrc);
}
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.