我希望在Google Maps上创建一个覆盖层,用不同的颜色显示不同的街道。
在Google Maps API中,可以创建标记和多边形来覆盖特定区域。
是否有一种方法来标记不同的街道?
在Google Maps API中,可以创建标记和多边形来覆盖特定区域。
是否有一种方法来标记不同的街道?
我觉得你对于在谷歌地图上展示一些应用程序特定的颜色感兴趣(而不是交通地图)。
如果是这样的话,那么你应该查看自定义覆盖层。你可以创建自己的透明背景覆盖层瓦片(带有彩色街道),将它们与谷歌地图瓦片匹配,然后将它们覆盖在地图上。你可以在Maps API reference - Overlays中找到这些内容的描述。
我实际上一直对尝试这个很感兴趣,这个问题可能是一个好的借口。我会告诉你我怎么做的。
编辑:好的,我尝试了一下,这很简单。你只需要在谷歌地图页面加载时获取瓦片图像(你想覆盖的区域),确保你跟踪原始URL,因为这些URL包含你需要编写瓦片覆盖方法的x,y坐标。
用你的彩色路段编辑瓦片,然后将它们上传到你的Web服务器。添加以下代码以在常规地图上使用覆盖层:
var myCopyright = new GCopyrightCollection("© ");
myCopyright.addCopyright(new GCopyright('Demo',
new GLatLngBounds(new GLatLng(-90,-180), new GLatLng(90,180)),
0,'©2007 Google'));
// Create the tile layer overlay and
// implement the three abstract methods
var tilelayer = new GTileLayer(myCopyright);
// properties of the tile I based my tile on
// v=w2.97&hl=en&x=38598&s=&y=49259&z=17&s=Galil.png
tilelayer.getTileUrl = function(point, zoom) {
if (zoom == 17 && point.x == 38598 && point.y == 49259)
return "../pics/times_square.png";
};
tilelayer.isPng = function() { return true;};
tilelayer.getOpacity = function() { return 1.0; }
var myTileLayer = new GTileLayerOverlay(tilelayer);
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(40.75740, -73.98590), 17);
map.addOverlay(myTileLayer)
这段代码覆盖了我的 Thing eats NY 瓷砖:
在缩放级别17下,x = 38598,y = 49259。
尝试深入挖掘用于在普通Google地图网站上显示交通叠加层的代码。
编辑:我刚刚查看了代码,似乎连Google都认为通过在服务器上生成交通线并将其作为透明PNG叠加层拉下来实现这一点更容易。