title: Polygons in google maps heatmap layer
body: <p>I'm trying to create heatmap consisting of polygons instead of points. 
  I create points using google.map.LatLng class and Polygon using Polygon class(code below)</p>
  
  <pre><code>const createPolygon = polygon =&gt; {
      const points = polygon.geometry.coordinates[0].map(point =&gt; {
          return new window.google.maps.LatLng(point[0], point[1]); // [lat, lng]
      });
      return new google.maps.Polygon({ // eslint-disable-line
          paths: points
      });
  </code></pre>
  
  <p>};</p>
  
  <p>Then i render it with HeatmapLayer component from react-google-maps library(don't think it matters though).</p>
  
  <pre><code> &lt;HeatmapLayer data={heatmapData.map(createPolygon)} /&gt;
  </code></pre>
  
  <p>Unfortunately I'm getting errors like this.</p>
  
  <pre><code>{message: "not an Array or MVCArray", name: "InvalidValueError", stack: "Error↵    at new mc (https://maps.googleapis.com/m…react-dom/lib/ReactCompositeComponent.js?:294:16)"}
  
  Uncaught TypeError: b.lat is not a function
  </code></pre>
  
  <p>I have also tried this aproach </p>
  
  <pre><code>&lt;HeatmapLayer data={new google.maps.MVCArray(data)} /&gt;
  </code></pre>
  
  <p>But then again I'm getting </p>
  
  <pre><code>Uncaught TypeError: b.lat is not a function
  </code></pre>
  
  <p>Do i have to create Polygon in some whacky way or is it straight impossible to acompplish what I'm trying to do?</p>
  
  <p>Any help and tips will be appreciated</p>