Question

我正在尝试让hotmapLayer在使用angular-google-maps构建的地图中工作。我已按以下方式设置HTML：

<ui-gmap-google-map center='playerMap.center' zoom='playerMap.zoom'>
  <ui-gmap-layer namespace="visualization" type="HeatmapLayer" show="true" onCreated="playerMap.heatmapCallback()"></ui-gmap-layer>
  <ui-gmap-markers
    models="playerMap.markers"
    coords="'self'"
    icon="'icon'"
    fit="true"
    doCluster="playerMap.cluster"
    options="'options'"
    click="playerMap.showWindow()"
    events="playerMap.markersEvents">
    <ui-gmap-window
      show="playerMap.window.show"
      coords="playerMap.window.model"
      options="playerMap.window.options"
      closeclick="playerMap.window.closeClick()"
      templateUrl="'/app/dmPlayerMap/infoWindow.html'"
      templateParameter="playerMap.window">
    </ui-gmap-window>
  </ui-gmap-markers>
</ui-gmap-google-map>

我很困惑我应该在playerMap.heatmapCallback()方法中添加什么以及我需要做的其他任何事情来设置基本热图。该领域的文档非常缺乏。

Answer 1

这个想法是使用function MockHeatLayer(heatLayer) { // Adding 500 Data Points var map, pointarray, heatmap; var taxiData = [ new google.maps.LatLng(37.782551, -122.445368), new google.maps.LatLng(37.782745, -122.444586), new google.maps.LatLng(37.782842, -122.443688), new google.maps.LatLng(37.782919, -122.442815), new google.maps.LatLng(37.782992, -122.442112), new google.maps.LatLng(37.783100, -122.441461), new google.maps.LatLng(37.783206, -122.440829), new google.maps.LatLng(37.783273, -122.440324), new google.maps.LatLng(37.783316, -122.440023), new google.maps.LatLng(37.783357, -122.439794), new google.maps.LatLng(37.783371, -122.439687) ]; var pointArray = new google.maps.MVCArray(taxiData); heatLayer.setData(pointArray); }; $scope.map = { center: { latitude: 37.782551, longitude: -122.445368 }, zoom: 12, heatLayerCallback: function (layer) { //set the heat layers backend data var mockHeatLayer = new MockHeatLayer(layer); }, showHeat: true };（没有括号，没有playerMap.heatmapCallback（））来创建加热层的点。

这是一个例子：

HTML中的

.container {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #ccf;}

控制器中的

<div class="container"></div>

您可以从here

获得更多积分

干杯！

如何在Angular-Google-Maps中使用heatmapLayer？

1 个答案: