折线 Google Maps V3 中的文本答案

【问题标题】：Text Within Polyline Google Maps V3折线 Google Maps V3 中的文本
【发布时间】：2017-09-21 18:54:03
【问题描述】：

我需要能够像嵌入的谷歌地图那样将文本放入我的折线中，正如您从下面的屏幕截图中看到的那样......

现在我查看了PolylineOptions API 参考和Polyline，但我看不出任何实现这一点的要点。我真的希望这是可能的，而且我不必一起破解一些东西。

【问题讨论】：

您是否找到了一种在折线上或折线内添加标签的方法？我自己还没有找到。
@Canadaka 我没有找到完全按照我的意愿去做的方法，但请查看接受的答案，因为这是我选择的解决方案。
我们知道这是否可行吗？我正在尝试用命名的小径构建一个小远足地图。

标签： google-maps google-maps-api-3

【解决方案1】：

这是一篇值得一看的文章，描述了如何向折线添加标签：

http://duncan99.wordpress.com/2013/02/28/google-maps-api-polylines-and-events/

【讨论】：

这并没有我想要的那么好，但它确实让我可以用折线放置标签

【解决方案2】：

我昨天发表评论询问是否有任何当前的方法可以在折线中添加文本。我知道这个问题已经解决，但我能看到的最后一个活动是在 2014 年。我在 github https://github.com/googlemaps/js-map-label

中偶然发现了这个库

它允许用户在地图上覆盖文本（另见示例文件夹）：

    var mapLabel = new MapLabel({
        text: 'Route name',
        position: pointCoordinate,
        map: map,
        fontSize: 12,
        align: 'left',
    });

注意，他们在“onAdd”方法中的源代码将窗格应用于地图级别，这意味着文本将位于折线下方。因此，我改为将其添加到 floatShadow 窗格中：

panes.floatShadow.appendChild(canvas);

代替：

panes.mapPane.appendChild(canvas);

我能够使我的地图看起来像：

【讨论】：

非常感谢。我也需要这个确切的功能，但在地图 API 中找不到它。我现在正在使用相同的工具，以及您将图层移动到路径上方的更新。谢谢！

【解决方案3】：

Google Maps Javascript API v3（当前）不支持向折线添加文本。您需要创建自己的custom overlays 来实现它。（我怀疑您是否可以轻松地使文本沿曲线“跟随”折线）

【讨论】：

这就是我害怕的。这将是一场噩梦
仅供参考。有一个为地图添加简单文本标签的预制解决方案，请参阅：github.com/erunyon/ELabel 但这样做的缺点当然是您不能旋转文本或将其弯曲以跟随线条。正如@geo 指出的那样，自定义叠加层将是可行的方法，我认为您将需要使用