在Google地图中标记街道

Question

我想在Google地图上创建一个叠加层,以不同的颜色显示不同的街道.

在Google Maps API中,可以创建覆盖特定区域的标记和多边形.

有没有办法以某种方式标记不同的街道？

Answer 1

在我看来，您有兴趣为您的 Google 地图显示（而不是交通地图）显示一些特定于应用程序的颜色。

\n\n

如果是这样，那么您应该检查自定义叠加层。您可以创建自己的透明背景叠加图块（带有彩色街道），将它们与 Google 地图图块匹配，然后将它们叠加在地图上。您可以在Maps API 参考 - Overlays中找到对此内容的描述 。

\n\n

我实际上有兴趣尝试一下，这个问题可能是一个很好的借口。我会让你知道我的情况。

\n\n

编辑：好的，我尝试过这个，非常简单。您只需要在谷歌地图页面加载时抓取图块图像（对于您想要覆盖的区域）。确保跟踪原始 url，因为它们具有编写图块覆盖方法所需的 x,y 坐标。

\n\n

用您的彩色道路编辑图块，然后将它们上传到您的网络服务器。添加以下代码以在常规地图上使用叠加层：

\n\n

var myCopyright = new GCopyrightCollection("\xc2\xa9 ");\nmyCopyright.addCopyright(new GCopyright(\'Demo\',\n              new GLatLngBounds(new GLatLng(-90,-180), new GLatLng(90,180)),\n                0,\'\xc2\xa92007 Google\'));\n\n// Create the tile layer overlay and \n// implement the three abstract methods                 \nvar tilelayer = new GTileLayer(myCopyright);\n\n// properties of the tile I based my tile on\n// v=w2.97&hl=en&x=38598&s=&y=49259&z=17&s=Galil.png\ntilelayer.getTileUrl = function(point,  zoom) { \n    if (zoom == 17 && point.x == 38598 && point.y == 49259)\n        return "../pics/times_square.png"; \n};\n\ntilelayer.isPng = function() { return true;};\ntilelayer.getOpacity = function() { return 1.0; }\n\nvar myTileLayer = new GTileLayerOverlay(tilelayer);\nvar map = new GMap2(document.getElementById("map"));\nmap.setCenter(new GLatLng(40.75740, -73.98590), 17);\nmap.addOverlay(myTileLayer)\n

\n\n

此代码覆盖了我的Thing eats NY瓷砖：

\n\n

\n\n

在 x = 38598 和 y = 49259 处，缩放级别为 17。

\n