在谷歌地图中围绕一个点绘制半径

关键词：

【中文标题】在谷歌地图中围绕一个点绘制半径【英文标题】：Draw radius around a point in Google map 【发布时间】：2010-10-23 23:19:17 【问题描述】：

我正在使用 Google Maps API 并添加了标记。现在我想在每个标记周围添加一个 10 英里的半径，这意味着一个在缩放时表现适当的圆圈。我不知道该怎么做，而且这似乎并不常见。

I found one example that looks good，你也可以看看谷歌纵横。他们在那里使用带半径的标记，就像我想要的那样。

更新：谷歌纵横使用 an image 进行缩放，它是如何工作的？ _{^{（功能已弃用）}子>}

【问题讨论】：

如果有用，可以看到一个例子here，带有可拖动的半径。 【参考方案1】：

使用 Google Maps API V3，创建一个 Circle 对象，然后使用 bindTo() 将其绑定到您的 Marker 的位置（因为它们都是 google.maps.MVCObject 实例）。

// Create marker 
var marker = new google.maps.Marker(
  map: map,
  position: new google.maps.LatLng(53, -2.5),
  title: 'Some location'
);

// Add circle overlay and bind to marker
var circle = new google.maps.Circle(
  map: map,
  radius: 16093,    // 10 miles in metres
  fillColor: '#AA0000'
);
circle.bindTo('center', marker, 'position');

您可以通过更改 fillColor、strokeColor、strokeWeight 等 (full API) 使其看起来像 Google Latitude 圆圈。

查看更多source code and example screenshots。

【讨论】：

Google maps API web.archive.org/web/20120312044803/http://code.google.com/apis/…的“Fun with MVC objects”一文中也有一个很好的例子【参考方案2】：

似乎实现这一点最常用的方法是绘制一个GPolygon，它有足够的点来模拟一个圆。您引用的示例使用此方法。 This page 有一个很好的例子 - 在源代码中查找函数 drawCircle。

【讨论】：

你好 @Chris B esa.ilmari.googlepages.com/circle.htm 是一个很好的链接，但是它是在 V2 中完成的，你能提供 v3 代码吗？？？【参考方案3】：

在球面几何形状中，形状由点、线和这些线之间的角度定义。你只有那些基本的价值观可以使用。

因此，圆（根据投影到球体上的形状）是必须使用点近似的东西。点越多，它看起来就越像一个圆圈。

话虽如此，请意识到谷歌地图是projecting the earth onto a flat surface（想想“展开”地球并拉伸+展平直到它看起来“方形”）。如果你有一个平面坐标系，你可以在上面绘制任何你想要的 2D 对象。

换句话说，您可以在谷歌地图上绘制一个缩放的矢量圆圈。问题是，谷歌地图并没有开箱即用（他们希望尽可能接近 GIS 值）。他们只给你GPolygon，他们希望你用它来近似一个圆。但是，this guy did it 将 vml 用于 IE，将 svg 用于其他浏览器（请参阅“SCALED CIRCLES”部分）。

现在，回到您关于使用缩放圆形图像的 Google 纵横的问题（这可能对您最有用）：如果您知道您的圆的半径永远不会改变（例如，它总是围绕某个点 10 英里)，那么最简单的解决方案是使用GGroundOverlay，它只是一个图像 url + 图像所代表的 GLatLngBounds。然后，您需要做的唯一工作是计算GLatLngBounds 代表您的 10 英里半径。一旦你有了它，谷歌地图 api 会在用户放大和缩小时处理你的图像。

【讨论】：

很好的答案。 IOW 意味着换句话说，OOTB 意味着开箱即用，对于那些需要像我一样查找它的人。【参考方案4】：

我以前遇到过这个问题，所以我收藏了这个discussion.

总结一下，你可以：

查看circle filter 的源代码，了解如何将其合并到您的项目中。 用足够多的点绘制一个 GPolygon 来模拟一个圆。 修改http://www.nearby.org.uk/google/circle.kml.php?radius=30miles&lat=40.173&long=-105.1024生成KML文件，然后导入。在 Google 地图中，您只需将 URI 粘贴到搜索框中，它就会显示在地图上。不过，我不确定您如何使用 API 来做到这一点。

【讨论】：

【参考方案5】：

我刚刚写了一篇博客文章来解决这个问题，你可能会发现它很有用： http://seewah.blogspot.com/2009/10/circle-overlay-on-google-map.html

基本上，您需要使用正确的 GLatLngBounds 创建一个 GGroundOverlay。棘手的一点是根据所需的半径计算这个想象正方形（GLatLngBounds）包围这个圆的西南角坐标和东北角坐标。数学相当复杂，但您可以参考博客中的 getDestLatLng 函数。其余的应该很简单。

【讨论】：

【参考方案6】：

有关 API v3 解决方案，请参阅：

http://blog.enbake.com/draw-circle-with-google-maps-api-v3

它围绕点创建圆圈，然后用不同的颜色显示范围内和范围外的标记。他们还计算动态半径，但在您的情况下，半径是固定的，因此工作量可能会减少。

【讨论】：

页面未找到，很遗憾。

如何在谷歌地图中绘制gpx文件

】如何在谷歌地图中绘制gpx文件【英文标题】：Howtodrawgpxfileingooglemaps【发布时间】：2016-05-3100:13:26【问题描述】：我实现了一个应用程序，我可以在其中存储用户的所有路径点，同时在gpx文件中移动。我想在谷歌地图中绘制路... 查看详情

在地图上围绕纬度/经度绘制时间半径

】在地图上围绕纬度/经度绘制时间半径【英文标题】：Drawtimeradiusaroundlat/longonmap【发布时间】：2019-02-2803:00:22【问题描述】：我正在使用R中的gmapsdistance包。我有我的API密钥，并且我熟悉包中的功能。但是，我想解决一个相反的... 查看详情

如何在谷歌地图中绘制多个地理点之间的路线（注意：这是公交车站路线）？

】如何在谷歌地图中绘制多个地理点之间的路线（注意：这是公交车站路线）？【英文标题】：Howtodrawaroutebetweenmanygeopointsingooglemap(note:thisisabusstoprouteline)?【发布时间】：2019-06-0703:49:27【问题描述】：Thisismyimage.Wrongroute.Iwanttothisr... 查看详情

如何在谷歌地图中制作多个圆圈颤动[关闭]

】如何在谷歌地图中制作多个圆圈颤动[关闭]【英文标题】：Howtomakemultiplecircleingooglemapflutter[closed]【发布时间】：2021-03-0601:21:46【问题描述】：我在不同的半径上有多个位置，我想根据半径值绘制圆。如果您在图片中看到两个圆... 查看详情

在谷歌地图的圆圈下画虚线

】在谷歌地图的圆圈下画虚线【英文标题】：Drawdottedlineunderthecircleingooglemap【发布时间】：2018-11-1704:21:08【问题描述】：我正在开发一个使用谷歌地图并在地图上绘制圆圈的Android应用程序，因此我在地图上创建了圆圈，但现在... 查看详情

使用位置坐标值在谷歌地图中绘制路线图

】使用位置坐标值在谷歌地图中绘制路线图【英文标题】：Routemapdrawingingooglemapsusingcoordinatevaluesoflocation【发布时间】：2015-12-1210:16:26【问题描述】：我正在开发一个地图应用程序，用户将在其中选择从可用点列表中的起点和终... 查看详情

如何在 JavaScript 中围绕折线绘制多边形？

...边形。在我的例子中，折线是一个谷歌地图方向，我需要在谷歌地图画布中围绕它显示一个多边形。第一：对于偏移，我使用JavaScriptClipper库。我有以下折线（路线）：我使用Clipper在下面制作 查看详情

在谷歌地图中做“沿途的兴趣点”

】在谷歌地图中做“沿途的兴趣点”【英文标题】：doing"pointsofinterestalongaroute"ingooglemaps【发布时间】：2011-04-2917:38:53【问题描述】：我需要允许旅行者使用谷歌地图绘制路线，然后查询我的兴趣点数据库（比如说，麦当... 查看详情

如何在android上的谷歌地图中绘制点？

...比如我开车去......我没有该功能的正确名称，所以我无法在谷歌上搜索它......有人知道我该怎么做吗？或该功能的名称？如果你不明白我在寻找什么是 查看详情

如何在谷歌地图中高效地绘制多条折线？

】如何在谷歌地图中高效地绘制多条折线？【英文标题】：HowtoDrawManyPolylinesinGoogleMapEfficiently?【发布时间】：2015-07-0804:54:26【问题描述】：我目前正在学习制作一个使用谷歌地图向用户显示数据的安卓应用。目前我正在使用折线... 查看详情

如何在谷歌地图的折线中点绘制标记？

】如何在谷歌地图的折线中点绘制标记？【英文标题】：HowtoplotthemarkerinthemiddlepointofthepolylineinGoogleMaps?【发布时间】：2017-05-1310:24:49【问题描述】：我在Google地图中绘制了一条折线，当单击折线时，我希望在折线上有一个标记。... 查看详情

如何使用谷歌地图API制作一个搜索特定半径周围项目的表单？

...：2019-01-0418:08:03【问题描述】：我正在处理website，我想在谷歌地图上围绕当前位置或一些手动地址制作一个圆圈。用户可以选择决定是要绕当前位置还是要提供的随机地址。（用户可以选择将手动地 查看详情

在谷歌地图上绘制方向

】在谷歌地图上绘制方向【英文标题】：DrawingdirectionsonGoogleMaps【发布时间】：2011-12-0318:10:21【问题描述】：我认为这将是一个非常基本的问题。我正在使用codigniter构建一个应用程序，其中用户必须在地图上标记目的地，GoogleMap... 查看详情

如何在谷歌地图中绘制历史国家数据（苏联、东德等）？

】如何在谷歌地图中绘制历史国家数据（苏联、东德等）？【英文标题】：Howtoplothistoriccountrydata(Us-s-r,EastGermany,etc)inGoogleMaps?【发布时间】：2012-05-2307:57:58【问题描述】：我正在使用FusionTables构建一系列信息图表，以显示国家/地... 查看详情

使用当前位置将折线绘制到目的地，并在谷歌地图上添加标记，标记颤动

】使用当前位置将折线绘制到目的地，并在谷歌地图上添加标记，标记颤动【英文标题】：Usecurrentlocationtodrawpolylinestoadestinationandalsotoaddmarkersongooglemapswithmarkersflutter【发布时间】：2021-09-2311:53:11【问题描述】：我有一个带有谷歌... 查看详情

在谷歌地图上绘制区域

】在谷歌地图上绘制区域【英文标题】：Drawingregionongooglemaps【发布时间】：2017-11-1803:41:27【问题描述】：如果我在谷歌地图中搜索查询，例如“carltonvictoriaaustralia”，那么它会给我一张该地区的地图，并在该地区周围有边界。... 查看详情

如何使用javascript在谷歌地图中的多个标记之间绘制路线图

】如何使用javascript在谷歌地图中的多个标记之间绘制路线图【英文标题】：HowtodrawRoutemapbetweenmultiplemarkersingooglemapsusingjavascript【发布时间】：2018-01-0217:24:06【问题描述】：我使用谷歌地图API开发了地图。标记通过适当的标签可... 查看详情

如何使用坐标数组在谷歌地图 API 中绘制多边形？

】如何使用坐标数组在谷歌地图API中绘制多边形？【英文标题】：howtodrawapolygoningooglemapAPIusingarrayofcoordinates?【发布时间】：2016-07-2213:27:44【问题描述】：我是JavaScript新手，我正在尝试使用googlemapAPI来绘制多边形。google.maps.Polygon... 查看详情