在Google地图结果上添加“search区域”大纲
去年，谷歌在许多地方报道了search区域提供的产品，并在Google地图上显示。 例如在这里 ，并在这里和这里报告。
为了明确，这是当谷歌添加与search查询相关的大纲。 如果您要search城镇，邮政编码或邮政编码，Google会突出显示该地图的这个区域。 例：
这显然不能通过API获得，只能通过Google自己的networking资源。
最近，我注意到一些其他域使用这个function，例如在Twitter上 。
Twitter和其他大型组织正在使用API吗？ 是否添加了此function，但尚未logging？ 或者我只是错过了公告，找不到任何文档？
你看到的轮廓来自twitter，它们一定是存储的。
看一下你在调用twitter页面时所要求的json文件： http : //api.twitter.com/1/geo/id/c3f37afa9efcf94b.json
我试过了， geometry.coordinates[0][0]定义了一个很好的多边形（猜测奥斯汀的轮廓）。
当你尝试它时，注意到这个对的顺序是lng,lat不是lat,lng
所以twitter-geo-API可能是实现大纲的一个好的开始，幸运的是twitter支持JSONP作为客户端解决scheme。
看一个例子： http : //jsfiddle.net/doktormolle/MRYm3/
<edit>
twitter-API已被更改，该示例不再有效（需要身份validation）
</edit>
由于Maps API还没有提供解决scheme，而且手动填充坐标是没有任何业务的，所以这是一个替代scheme。 在GIS网站上find了这个答案 – 绝对的救生员（在上面画了卡尔加里的图片，可以节省很多时间）：
您可以使用openstreetmap在Google地图中使用json获取多边形坐标。 转到http://nominatim.openstreetmap.org/ 。 search像“San Francisco，CA”的地方
点击“详情”
查找OSM ID并将其复制（control + c），例如：2018776
来源： GIS
我发现了一个很好的解决scheme来绘制城市边界。
这是一个非常酷的工具，你可以绘制城市边界。 你可以像你想的那样精确： http : //www.birdtheme.org/useful/v3tool.html
在右侧，您可以实时查看代码。 您可以selectKML和JavaScript。 切换到JavaScript。 然后复制你的坐标。
这里是您可以看到布鲁塞尔（欧洲）边界的完整网站。
<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>::Maps ::</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&key=AIzaSyD0X4v7eqMFcWCR-VZAJwEMfb47id9IZao"></script> <script type="text/javascript"> var map; //COORDS var brussels = [ new google.maps.LatLng(50.835866,4.258575), new google.maps.LatLng(50.818083,4.244499), new google.maps.LatLng(50.811358,4.276428), new google.maps.LatLng(50.813094,4.302177), new google.maps.LatLng(50.773162,4.338226), new google.maps.LatLng(50.764259,4.384918), new google.maps.LatLng(50.793132,4.482422), new google.maps.LatLng(50.810274,4.450836), new google.maps.LatLng(50.821120,4.476585), new google.maps.LatLng(50.852342,4.462852), new google.maps.LatLng(50.866861,4.421310), new google.maps.LatLng(50.895021,4.430580), new google.maps.LatLng(50.911692,4.413757), new google.maps.LatLng(50.912342,4.395561), new google.maps.LatLng(50.898486,4.377708), new google.maps.LatLng(50.900868,4.328957), new google.maps.LatLng(50.889174,4.293251), new google.maps.LatLng(50.880294,4.297028), new google.maps.LatLng(50.861878,4.279175), new google.maps.LatLng(50.855593,4.288788), new google.maps.LatLng(50.837817,4.282608), new google.maps.LatLng(50.835866,4.259605) ]; $(document).ready(function () { //WHERE TO CENTER YOUR MAP var latlng = new google.maps.LatLng(50.834999,4.387665); var myOptions = { zoom: 10, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var BrusselsHightlight; //DRAW THE POLYGON OR POLYLINE BrusselsHightlight = new google.maps.Polygon({ paths: brussels, strokeColor: "#6666FF", strokeOpacity: 0.8, strokeWeight: 2, fillColor: "#6666FF", fillOpacity: 0.35 }); BrusselsHightlight.setMap(map); }); </script> <style type="text/css"> html,body { height: 100%; margin: 0px; padding: 0px; } #map_canvas { width:600px; height:400px; } </style> </head> <body > <div id="map_canvas"> </div> <!--main--> <div id="map_cord"></div> </body> </html>
这对我来说真的很棒。
