javascript - 使用破折号或点设置 Google map v3 折线样式?

标签 javascript api google-maps styling polyline

我想要一张基于 Google map v3 的 map ,其中包含一些自定义折线,并将其中一些线设为点线或虚线。我似乎找不到任何方法可以做到这一点。可能吗?如果可能的话,如何实现?

最佳答案

此功能已添加到折线选项中,称为 Symbols on Polylines

创建虚线如下所示( demo ):

var lineCoordinates = [
  new google.maps.LatLng(22.291, 153.027),
  new google.maps.LatLng(18.291, 153.027)
];

var lineSymbol = {
  path: 'M 0,-1 0,1',
  strokeOpacity: 1,
  scale: 4
};

var line = new google.maps.Polyline({
  path: lineCoordinates,
  strokeOpacity: 0,
  icons: [{
    icon: lineSymbol,
    offset: '0',
    repeat: '20px'
  }],
  map: map
});

短划线长度由path的+/-1控制,间距由repeat控制。它有点冗长,但非常灵活。

除了破折号之外,新功能还包括圆形、箭头的预定义路径,文档甚至还包括动画演示:)

关于javascript - 使用破折号或点设置 Google map v3 折线样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6098947/

相关文章:

javascript - 在 JavaScript 中处理 HTTP XML 流

javascript - Ng-model 没有按预期工作?

c# - 获取所有者姓名

android - 如何根据标记位置设置 Google map 的缩放级别

google-maps - 如何从应用程序本身启用位置跟踪权限?

Javascript - 再次评估参数

php - CakePHP 从 Google Analytics 保存数据

api - REST API : Where should I code my workflow?

google-maps - 谷歌地图 - 绘制多个纬度经度对之间的线和距离(如乌鸦飞行)

javascript - ionic 侧菜单 : disable drag for one side but allow to other?