使用谷歌地图绘制不规则同心圆答案

【问题标题】：Drawing irregular concentric circles using Google Maps使用谷歌地图绘制不规则同心圆
【发布时间】：2009-09-05 03:45:34
【问题描述】：

我有一点问题。我正在尝试使用 Javascript 和 Google Maps API v2 执行以下操作：

我可以使用在互联网上找到的公式很好地绘制单个圆圈。我面临的问题是圈子必须：

A.同心，并且 B. 每个“象限”必须有不同的半径，即 NE、NW、SE 和 SW

我几乎在 Internet 上搜索了我能想到的所有地方，但没有想出如何做到这一点。显然以前有人这样做过，因此我为什么要在程序员论坛上提问。 :)

谢谢！

更新：我已经使用以下代码绘制了我认为每个点的坐标。如下图：

这是使用以下 JS 获得的：

http://gist.github.com/181290

注意：此 javascript 来自（稍作修改）以下站点，该站点可能包含更多关于算法最终可能的答案：http://www.movable-type.co.uk/scripts/latlong.html

更新 2：我能够在 Google 地图中获得此信息：

使用以下代码创建：

var NEQ = [0, 90];
var SEQ = [90, 180];
var SWQ = [180, 270];
var NWQ = [270, 0];

// var centrePoint = new LatLon(25.0, -83.1);
// pointsForWindQuadrant(NEQ, centrePoint, 50);
function pointsForWindQuadrant(quadrantDegrees, centrePoint, radius){
  var points = [];

  // Points must be pushed into the array in order
  points.push(new google.maps.LatLng(centrePoint.lat, centrePoint.lon));

  for(i = quadrantDegrees[0]; i <= quadrantDegrees[1]; i++){
    var point = centrePoint.destPoint(i, radius * 1.85);
    points.push(new google.maps.LatLng(point.lat, point.lon)); // Radius should be in nautical miles from NHC
  }

  points.push(new google.maps.LatLng(centrePoint.lat, centrePoint.lon));

  return points;
}

更新 3： 我可能还应该指出，这是针对地理坐标系（因为这整件事是针对热带气旋风半径），而不是笛卡尔坐标系坐标系。谢谢！

【问题讨论】：

你打算制作麦田怪圈吗？
是的，它适用于热带气旋，而不是麦田怪圈。 ;)
您最好重新定位这个问题，使其与语言和库无关。您确实需要更多的算法，也许还需要定义一两个数据结构。一旦你有了这些，将它移植到 JavaScript 并将值传递给 Google Maps API 将是微不足道的。
我添加了“几何”和“圆形”标签；这还不够吗？我很乐意更详细地讨论该算法，或者我认为我需要什么。一开始我对几何学不太感兴趣；）干杯！
到目前为止，您（自己）想到了什么？如果我们发现您尝试了其他方法而不是简单的 google。可能会获得更多帮助。

标签： javascript algorithm maps geometry

【解决方案1】：

基本上，将圆计算为 x,y = (cos(a), sin(a))，然后将其（两项）乘以半径，该半径是角度的适当函数。我不太了解 Javascript 或 Google 地图，所以我将在 Python 中执行此操作，希望从中可以清楚地了解。

from pylab import *

def Rscale(a):
    if a>3*pi/2:  # lower right, and then work CW around the circle
        return 1.
    elif a>pi:  # lower left
        return .9
    elif a>pi/2:   # upper left
        return .8
    else:       # upper right
        return 1.

def step_circle(R):
    return array([(R*Rscale(a))*array([cos(a), sin(a)]) for a in arange(0, 2*pi, .001)])

for R in (.5, .7, .9):  # make three concentric circles
    c = step_circle(R)
    plot(c[:,0], c[:,1])

show()

这给了

我无法真正按照您的草图进行操作，所以我只是猜测了数字。另外，我将最右边的两个象限设置为相同，因为这就是您的情节，但这当然是可选的。

【讨论】：

这个看起来可能是正确的答案，但在我知道我可以正确翻译之前我无法确定。有 JS 和 Google Maps API 经验的人愿意帮忙翻译吗？

【解决方案2】：

我想通了。这是最终的代码。或许可以重构一下？

// Returns points for a wind field for a cyclone. Requires
// a LatLon centre point, and an array of wind radii, starting
// from the northeast quadrant (NEQ), i.e., [200, 200, 150, 175]
//
// Returns points to be used in a GPolyline object.
function pointsForWindQuadrant(centrePoint, radii){
  if(radii.length != 4){ return false; }

  var points = [];
  var angles = [0, 90, 180, 270];

  // For each angle 0, 90, 180, 270...
  for(a = 0; a < angles.length; a++){
    // For each individual angle within the range, create a point...
    for(i = angles[a]; i <= angles[a] + 90; i++){
      var point = centrePoint.destPoint(i, radii[a] * 1.85); // Radius should be in nautical miles from NHC
      points.push(new google.maps.LatLng(point.lat, point.lon));
    }
  }

  // Add the first point again, to be able to close the GPolyline
  var point = centrePoint.destPoint(0, radii[0] * 1.85);
  points.push(new google.maps.LatLng(point.lat, point.lon));

  return points;
}

这会导致以下结果：

【讨论】：