【问题标题】:Google Maps Polygon Fill Color Disappearing with improper geometry谷歌地图多边形填充颜色因几何形状不正确而消失
【发布时间】:2018-08-08 17:09:56
【问题描述】:

我在 Google 地图 Android 平台上的多边形中保持多边形填充颜色时遇到问题。当多边形路径与自身重叠时,填充颜色会消失。我使用相同的方法在 iOS 上突出显示我的路径,但它没有这种行为。请查看这些图像以注意当多边形路径中存在重叠时填充颜色如何消失。

这是重叠前正确的颜色填充:

当同一多边形内有多边形路径点时颜色消失:

iOS 上的行为不一样。多边形在 iOS 上保持填充。这是谷歌地图文档的摘录:

Fill color in ARGB format, the same format 
used by Color. The default value is 
transparent (0x00000000). If the polygon 
geometry is not specified correctly (see 
above for Outline and Holes), then no fill 
will be drawn.

这是我正在使用的代码。基本上我有一条宽度为 X 的路径,宽度为 X 的路径被突出显示:

随着位置的变化,我取当前位置并计算左右点,例如:

LatLng leftPoint = 
SphericalUtil.computeOffset(presentLoc, 
widthInFeet * 0.3048, heading - 90);

接下来我取右侧并反转数组并将其添加到左侧以制作多边形路径。然后,我将该点数组传递到多边形中,以便随着位置的变化进行更新。

polygon.setPoints(polyPoints);
polygon.setFillColor(YELLOW);
polygon.setStrokeWidth(1);

当有不可避免的重叠时,例如急转弯等,如何使上面的图像保持其填充颜色?

我从下面使用了这个 com.google.maps.android.PolyUtil.simplify 来进行 Douglas-Peucker 简化,但是这对于重叠或通过路径返回的急转弯没有帮助。我很想使用多个较小的多边形而不是一个大的多边形,但我不想浪费系统资源,尤其是当应用程序具有相当大的路径时。

【问题讨论】:

  • 听起来像一个错误;我想知道当多边形复杂时使用 com.google.maps.android.PolyUtil.simplify 是否是一种可能的解决方法,如果这适合您,理论上可以消除示例中的内部三角形。
  • if the polygon geometry is not specified correctly 提示,这个多边形一开始就不应该有洞,或者至少要打掉这些顶点。

标签: android google-maps


【解决方案1】:

我想我至少应该演示一下简化可以实现什么,并让您决定它是否可取。坦率地说,我还没有看到很多关于他们的算法如何执行的示例。

问题变成了公差参数需要是什么 - 对于一般情况而言,这可能是一个困难的参数。

代码很简单——创建了两个多边形,一个是简化的结果。这也演示了没有填充透明多边形的错误。

    List<LatLng> points = new ArrayList<>();
    points.add(new LatLng(39.182937,-76.823560));
    points.add(new LatLng(39.180741,-76.821758));
    points.add(new LatLng(39.190454, -76.810985));
    points.add(new LatLng( 39.190221, -76.812530));
    points.add(new LatLng(39.186961, -76.808239));
    points.add(new LatLng(39.188724,-76.806264));
    points.add(new LatLng(39.192882, -76.811328));
    points.add(new LatLng(39.182937, -76.823560));

    PolygonOptions rectOptions = new PolygonOptions()
            .addAll(points);
    // Get back the mutable Polygon
    Polygon polygon = mMap.addPolygon(rectOptions);
    polygon.setFillColor(Color.YELLOW);


    points = new ArrayList<>();
    points.add(new LatLng(39.182937,-76.834560));
    points.add(new LatLng(39.180741,-76.832758));
    points.add(new LatLng(39.190454, -76.821985));
    points.add(new LatLng( 39.190221, -76.823530));
    points.add(new LatLng(39.186961, -76.819239));
    points.add(new LatLng(39.188724,-76.817264));
    points.add(new LatLng(39.192882, -76.822328));
    points.add(new LatLng(39.182937, -76.834560));
    points = PolyUtil.simplify(points, 200.0);

    rectOptions = new PolygonOptions()
            .addAll(points);
    // Get back the mutable Polygon
    polygon = mMap.addPolygon(rectOptions);
    polygon.setFillColor(Color.YELLOW);

最后是结果——很明显,在算法中内三角形的一个顶点胜出的简化中牺牲了一些保真度——但仍然很有趣:

请注意,在此示例中,容差阈值约为 120 米 - 即产生影响的点。

我同意@MartinZeitler 的观点,您最有可能的解决方案是移除内部点。

【讨论】:

  • 感谢视觉示例。我使用了您建议的简化方法,但是,此应用程序用于使用外部 GPS 设备进行精确突出显示,目标是在几米之内。我可以在高容忍度下简化工作,但是在这种情况下效果不佳。一段时间以来,我一直在 iOS 和 Google Maps 上使用单多边形方法,但它的行为方式与 android API 不同。我想我会尝试用 SVG 或类似的东西填充该区域。再次感谢您的示例。
【解决方案2】:

在onMapReady中调用方法-onpostExe();

private void onpostExe() {
        if (points != null && points.size() > 0) {
            PolylineOptions lineOptions;
            lineOptions = new PolylineOptions();
            lineOptions.addAll(points);
            lineOptions.width(8);
            lineOptions.color(Color.RED);
            lineOptions.geodesic(true);
 mMap.addPolyline(lineOptions);
}

重叠是可能的,但是当使用宽度大小来解决重叠问题时

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-03-12
    • 2012-12-09
    • 2014-12-20
    • 2017-05-20
    • 1970-01-01
    • 2012-06-02
    • 2014-06-09
    相关资源
    最近更新 更多