Doesn't work with google maps

[amgadfahmi]

Am trying to apply it for a div contain angular google maps and getting the following error

XMLHttpRequest cannot load https://maps.googleapis.com/maps/api/js/StaticMapService.GetMapImage?1m2&1i813&2i677&2e2&3u3&4m2&1u763&2u400&5m5&1e3&5sen&6sus&10b1&12b1&token=47416. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

      <div  class="analysisMapContainer" id="map">
            <ui-gmap-google-map center='map.center' zoom='map.zoom'  control="map.control" options="map.options" >
            <ui-gmap-map-control template="refresh.tpl.html" position="top-right" index="1" controller="refreshController" ></ui-gmap-map-control>
            <ui-gmap-layer namespace="visualization" type="HeatmapLayer" show="map.showData" onCreated="map.heatLayerCallback"></ui-gmap-layer>
            </ui-gmap-google-map>
        </div>

[spaceghostu]

+1

[w-up]

+1

[lewisMachilika]

using leaflet i am able to capture the base map only, but i wanted to include markers as well