问题描述
我已经实现了带有agm组件的google map。我设法在其上显示wms层。应用完我想做的之后,就是打印地图图像。当我打印图像时,谷歌地图会出现在打印预览中,但wms图层没有出现。
printMap() {
var contents = window.document.getElementById("gmap");
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']:'';
frameDoc.document.open();
frameDoc.document.write('<html><head>');
frameDoc.document.write(`<style>.agm-map-container-inner{height: 800px;width: 800px;position:absolute;}</style></head><body>`);
frameDoc.document.write(contents.innerHTML);
frameDoc.document.write('</body></html>');
frameDoc.document.close();
setTimeout(function () {
window.frames["frame1"].focus();
window.frames["frame1"].print();
document.body.removeChild(frame1);
},500);
return false;
}
<div id="gmap" class="col-md-8">
<agm-map
[latitude]="lat"
[longitude]="lng"
[zoom]="zoom"
(mapClick)="addMarker($event)"
(mapReady)="onMapReady($event)"
>
<agm-data-layer *ngIf="geoJsonObject" [geoJson]="geoJsonObject" [style]="styleFunc"></agm-data-layer>
<agm-marker [latitude]="lat" [longitude]="lng" [markerDraggable]="true"
(dragEnd)="markerDragEnd($event)" [agmFitBounds]="true">
</agm-marker>
</agm-map>
</div>
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)