【发布时间】:2018-02-08 03:55:28
【问题描述】:
我试图打印包含谷歌地图和一些标记的页面。我在互联网上找到了有关如何打印页面的信息。但它只打印谷歌地图而不是地图内的标记。
这是我迄今为止尝试过的代码。我不确定我在哪里做错了。
<body>
<div class="container">
<div id="button-container">
<a href="#" id="PrintDiv" class="btn btn-success btn-primary"><span class="glyphicon glyphicon-print" aria-hidden="true"></span>Print</a>
</div>
<div id="map"></div>
</div>
</body>
<script type="text/javascript">
$(function(){
$('#PrintDiv').click(function(){
$(this).hide();
var contents = document.getElementById("container").innerHTML;
var frame1 = document.createElement('iframe');
frame1.name = "frame1";
frame1.style.position = "absolute";
frame1.style.top = "-1000000px";
document.body.appendChild(frame1);
var frameDoc = frame1.contentWindow ? frame1.contentWindow : frame1.contentDocument.document ? frame1.contentDocument.document : frame1.contentDocument;
frameDoc.document.open();
frameDoc.document.write('<html><head><title></title>');
frameDoc.document.write('</head><body>');
frameDoc.document.write(contents);
frameDoc.document.write('</body></html>');
frameDoc.document.close();
return false;
})
})
var beaches = [
["Place A", 21.984606, 89.974250],
["West Bengal", 21.681855, 88.584980],
["Sea Beach", 21.617401, 87.500898]
];
var markers = [];
var map; //set scope here so various functions can use them
function initialize() {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 2,
center: new google.maps.LatLng(beaches[0][1], beaches[0][2]),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < beaches.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(beaches[i][1], beaches[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(beaches[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
markers.push(marker);
}
}
</script>
【问题讨论】:
标签: javascript php google-maps google-maps-api-3