在谷歌地图中使用getTile()函数的正确方法

时间:2012-04-21 12:32:02

标签: php javascript jquery ajax google-maps

我正在使用tile id在数据库中存储标记。

因此,当某个图块在地图上显示时,此图块包含的所有标记都是

也请求并显示。

所以我最终创建了一个无效的代码。它没有要求所有必要的

瓦片。为了更准确,每次我移动地图时它只请求一个图块。

     ServerFetchMapType.prototype.tileSize = new google.maps.Size(256,256);

     ServerFetchMapType.prototype.maxZoom = 100;

     ServerFetchMapType.prototype.name = "Server Tile #s";

     ServerFetchMapType.prototype.alt  = "Server Data Tile Map Type";

ServerFetchMapType.prototype.getTile = function(coord, zoom, ownerDocument){

  if(zoom>10){

  var tileId=this.getAddrLatLng(coord,zoom);

  if(isTileAlreadyLoaded(tileId)){
    return ;
  }

  ServerFetchedTiles[tileId] = true;

  var url = "markerRequestPageJson.php?tileNumber=";
  var json;
   $.getJSON(url+tileId,function(json){
    // this is where we can loop through the results in the json object
        var _item;
        var infoWindow = new google.maps.InfoWindow;

        $.each(json, function(i,_item){
            var point = new google.maps.LatLng(
              parseFloat(_item.lat),
              parseFloat(_item.lng));
            var html = _item.id + "<br/>";
            var marker = new google.maps.Marker({
            map: map,
            position: point
          });

          markerClusterer.addMarker(marker);
          bindInfoWindow(marker, map, infoWindow, html);
        });
});

 }
 return;

};

但最后我做了一些改变,它的工作原理应该是:

     ServerFetchMapType.prototype.tileSize = new google.maps.Size(256,256);

     ServerFetchMapType.prototype.maxZoom = 100;

     ServerFetchMapType.prototype.name = "Server Tile #s";

     ServerFetchMapType.prototype.alt  = "Server Data Tile Map Type";

ServerFetchMapType.prototype.getTile = function(coord, zoom, ownerDocument){

  if(zoom>10){

  var tileId=this.getAddrLatLng(coord,zoom);

  if(isTileAlreadyLoaded(tileId)){
    return ;
  }

  ServerFetchedTiles[tileId] = true;

  var div = ownerDocument.createElement('DIV');

  var url = "markerRequestPageJson.php?tileNumber=";
  var json;
   $.getJSON(url+tileId,function(json){
    // this is where we can loop through the results in the json object
        var _item;
        var infoWindow = new google.maps.InfoWindow;

        $.each(json, function(i,_item){
            var point = new google.maps.LatLng(
              parseFloat(_item.lat),
              parseFloat(_item.lng));
            var html = _item.id + "<br/>";
            var marker = new google.maps.Marker({
            map: map,
            position: point
          });

          markerClusterer.addMarker(marker);
          bindInfoWindow(marker, map, infoWindow, html);
        });
});
  return div;
 }
 return;

};

我的问题:这是一个合适的解决方案吗?

1 个答案:

答案 0 :(得分:0)

我不确定你在这里要做什么;但为什么你要点击正在加载哪个瓷砖呢?

你可以给Marker {position:the_position,...}并且Maps API应该关注显示它,不是吗?