Экспорт Google Map Heatmap слой в формате PDF

Question

я реализовал Heatmap на карте Google, используя карту Google Javascript API.You можно увидеть раздел кода следующий

function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 14, 
      center: {lat: -33.865143, lng: 151.209900}, // longitude and latitude of initial map center point 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      minZoom:4 
     }); 
     setupHeatMapData(); 
    } 
function setupHeatMapData(){ 
     heatmap = new google.maps.visualization.HeatmapLayer({ 
      data: heatmapdata, 
     }); 
     heatmap.setMap(map); 
} 

Это снимок Heatmap слоя,

Но дело в том, что я хочу экспортировать слой heatmap как изображение или PDF.I надеюсь на решение.

Answer 1

я найти решение для моих question.i хотел бы поделиться со всем сообществом .basically я использую два JavaScript liabries. Они jsPDF и html2canvas. Использование jsPDF для рендеринга pdf, помещая текст, изображения. и библиотека html2canvas для создания объекта canvas, выбрав элемент jquery в html. мы можем создать объект canvas, также выбрав тег div. пожалуйста, пройти через следующие шаги

<div class="row map-containner"><div id="map"></div><div> 

<script src="js/jspdf/jspdf.min.js"></script> 
<script src="js/jspdf/html2canvas.min.js"></script> 

// JAVA SCRIPT КОД

 var element = $('#map'); 
     var pdfOptions = { 
      orientation: "landscape", // One of "portrait" or "landscape" (or shortcuts "p" (Default), "l") 
      unit: "mm",    //Measurement unit to be used when coordinates are specified. One of "pt" (points), "mm" (Default), "cm", "in" 
      format: "legal"   //One of 'a3', 'a4' (Default),'a5' ,'letter' ,'legal' 
     }; 

     var doc = new jsPDF(pdfOptions); 

     var pageWidth = doc.internal.pageSize.width-20; 
     var width = pageWidth; 

     html2canvas(element, { 
      useCORS: true, // MUST 
      onrendered: function(canvas) { 
       var imgWidth = element.width(); 
       var imgHeight = element.height(); 

       var height = (pageWidth * imgHeight)/ imgWidth 
       var imgData = canvas.toDataURL(
         'image/png'); 
       doc.addImage(imgData, 'PNG', 10, 30 , width, height); 
       doc.save('heatmap.pdf'); 
      } 
     }); 

В этом случае мы можем оказать Heatmap и отобразили в PDF но есть проблема на предоставление маркеров на карте Google в PDF.we может найти решение на этом LINK. Пожалуйста, поделитесь любым хорошим решением для экспорта маркеров google также в PDF.

Answer 2

Надеюсь, вы сможете использовать следующие способы решения проблемы.

1. html2canvas: http://html2canvas.hertzen.com/

2. jsFeedback: http://experiments.hertzen.com/jsfeedback/

3. Google API изображение карты: https://developers.google.com/maps/documentation/imageapis/