Google Map屏幕截图无法正常工作。灰色屏幕出现在输出图像文件中。对于DIV部分中的简单文本，可以正常工作。对此的任何建议。
我尝试过这样的尝试：
<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>
<script type="text/javascript" src ="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script type="text/javascript" src="html2canvas.js?rev032"></script>
</script>
<script type="text/javascript">
function initialize()
{
var mapProp = {
center:new google.maps.LatLng(51.508742,-0.120850),
zoom:5,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("googleMap"), mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
$(window).load(function(){
$('#load').click(function(){
html2canvas($('#googleMap'), {
onrendered: function (canvas) {
var dataURL = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
window.location.href = dataURL;
}
});
});
});
</script>
</head>
<body>
<div id="googleMap" style="width:500px;height:380px;"></div>
<input type="button" value="Save" id="load"/>
</body>
</html>
更新：
我替换了以下代码部分。工作正常，但保存为。部分文件。保存到本地磁盘时可以给它一个名字吗？
$(window).load(function(){
$('#load').click(function(){
html2canvas($('#googleMap'), {
useCORS: true,
onrendered: function (canvas) {
var dataUrl= canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
window.location.href = dataUrl;
}
});
});
});
您可以使用称为filesaver的JS库。它的用法是：
saveAs(myImage, "image.png");
我目前正在尝试使用html2canvas保存Google地图，但我正在灰色背景。
另外，HTML2Canvas的新用法是：
html2canvas(cloneThisCanvas).then(function(canvas) {
//your canvas callback
});