1

Google マップの上にオーバーレイ ヒートマップを配置しています。より具体的には、このプラグインを使用しています: http://www.patrick-wied.at/static/heatmapjs/example-heatmap-googlemaps.html

ここで、何かが変更されるたびにマップを更新しているため、私の実装はデモとは少し異なります。

google.maps.event.addListenerOnce(map, 'idle', function(event){ updateHeatMap();});

なりました：

google.maps.event.addListener(map, 'idle', function(event){ updateHeatMap();});

ズームとパンが必要に応じて更新されている間、マップをドラッグするたびに、オーバーレイの「色」がマップによって移動した距離の 2 倍移動することに気付きました。一方、ズームは完璧に機能するため、ズームインおよびズームアウトすると位置が再び修正されます。

idleこれは、イベントがトリガーされるたびにデータが更新される場合にのみ発生します。私の実装とは異なり、デモはマップを 1 回しかロードしないため、問題なく動作します。

次のコードに何か問題があるのではないかと疑っていますが、実際の問題を検出できませんでした。

HeatmapOverlay.prototype.setDataSet = 関数(データ){

var me = this,
    currentBounds = me.map.getBounds(),
    mapdata = {
        max: data.max,
        data: []
    },
    d = data.data,
    dlen = d.length,
    projection = me.getProjection(),
    latlng, point;

me.latlngs = [];

while(dlen--){    
  latlng = new google.maps.LatLng(d[dlen].lat, d[dlen].lng);
    if(!currentBounds.contains(latlng)) { 
        continue; 
    }

  me.latlngs.push({latlng: latlng, c: d[dlen].count});    point = me.pixelTransform(projection.fromLatLngToContainerPixel(latlng));
  mapdata.data.push({x: point.x, y: point.y, count: d[dlen].count});
}
me.heatmap.clear();
me.heatmap.store.setDataSet(mapdata); }

今これを解決しようとして多くの時間を無駄にしたので、あなたからの洞察をいただければ幸いです...

どうもありがとう、本当にありがとう！

4

1 に答える 1

0

上記のことは気にしないでください。

Google には独自のヒートマップ ライブラリがあることに気付き、それを使用するようにコードを変換しました。よく働く！

https://developers.google.com/maps/documentation/javascript/layers#JSHeatMaps

于 2013-08-08T17:03:21.133 に答える