2

我正在尝试应用由WeatherBug温度/雷达/湿度提供的自定义层。使用谷歌javascript库等进入我的谷歌地图。

我需要在我的谷歌地图上应用透明瓷砖。

我从以下网址获取平铺图像。那么我怎样才能将它绑定到我的地图中呢？

http://i.wxbug.ne​​t/GEO/Google/Temperature/GetTile_v2.aspx?as=0&c=0&fq=0&tx=0&ty=0&zm=1&mw=1&ds=0&stl=0&api_key=xxxxx

4

2 回答 2

1

您应该能够将其添加为 Google 自定义地图类型。基本上，在请求 WeatherBug API 时，您会得到一个可以在 Google 地图上使用的图块。

您可以在此处找到来自 Google 地图的文档。

您开始的代码应该如下所示，您可以从这一点开始：

var tileLayerOverlay = new GTileLayerOverlay(
  new GTileLayer(null, null, null, {
    tileUrlTemplate: 'http://i.wxbug.net/GEO/Google/Temperature/GetTile_v2.aspx?as=0&c=0&fq=0&tx={X}&ty={Y}&zm={Z}&mw=1&ds=0&stl=0&api_key=xxxxx',
    isPng:true,
    opacity:1.0
  })
);

map.addOverlay(tlo);

还要检查WeatherBug 描述和其中的链接。

于 2012-10-10T07:00:37.580 回答
0

以下是受以下启发的 WMS 服务解决方案：http ://code.google.com/p/biodiversity-imageserver/source/browse/trunk/unittest/gmap3/MCustomTileLayer.js?r=49

您可以根据需要简单地调整功能。

function MCustomTileLayer(map,url) {
this.map = map;
this.tiles = Array();
this.baseurl = url;
this.tileSize = new google.maps.Size(256,256);
this.maxZoom = 19;
this.minZoom = 3;
this.name = 'Custom Layer';
this.visible = true;
this.initialized = false;
this.self = this;
}

MCustomTileLayer.prototype.getTile = function(p, z, ownerDocument) {
for (var n = 0; n < this.tiles.length ; n++) {
    if (this.tiles[n].id == 't_' + p.x + '_' + p.y + '_' + z) {
        return this.tiles[n];
    }
}
var tile = ownerDocument.createElement('IMG');
tile.id = 't_' + p.x + '_' + p.y + '_' + z;
tile.style.width = this.tileSize.width + 'px';
tile.style.height = this.tileSize.height + 'px';
tile.src = this.getTileUrl(p,z);
if (!this.visible) {
    tile.style.display = 'none';
}
this.tiles.push(tile);

while (this.tiles.length > 100) {
    var removed = this.tiles.shift();
    removed = null;
}
return tile;
};

MCustomTileLayer.prototype.getTileUrl = function(p,z) {
var url = this.baseurl +
          "&REQUEST=GetMap" +
          "&SERVICE=WMS" +
          "&VERSION=1.1.1" +
          "&BGCOLOR=0xFFFFFF" +
          "&TRANSPARENT=TRUE" +
          "&SRS=EPSG:3857" +
          "&WIDTH=256" +
          "&HEIGHT=256" +
          "&FORMAT=image/png" +
          "&mode=tile" +
          "&tilemode=gmap" +
          "&tile="+ p.x + "+" + p.y + "+" + z
return url;
}

你可以这样使用它

var hMap = new MCustomTileLayer(map, "http://my_base_url");
map.overlayMapTypes.insertAt(0, hMap);

并删除覆盖

map.overlayMapTypes.setAt(0,null);
于 2012-10-10T11:31:01.543 回答