【问题标题】:Google Maps API : Rotation with a custom marker IconGoogle Maps API:使用自定义标记图标旋转
【发布时间】:2018-09-10 17:08:15
【问题描述】:

我正在使用 Google Map Javascript API,我正在尝试创建一个带有自定义图标的自定义标记,该图标可用于旋转,

var marker = new google.maps.Marker({
    position: latlng,
    map: this.map
});

marker.setIcon({
  url:"assets/icon/nav.png",
  //path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
  scale: 1,
  rotation: heading,
  scaledSize: new google.maps.Size(35, 35),
});

rotation 属性使用 google.maps.SymbolPath.XXXX 作为代码中注释的行,但不像我在代码中写的那样使用自定义图标图像,

所以我想问是否有任何解决方案可以让自定义图标图像旋转?或者从图像创建 google.maps.SymbolPath ?

【问题讨论】:

标签: javascript google-maps google-maps-api-3 google-maps-markers


【解决方案1】:

1) 不,因为 Icon object 没有 rotation 属性,并且

2) 是的,您可以,但为此,您需要使用 Symbol objectSVG path notation。您可以查看this answerthis example 了解更多信息。

var symbol = {  
    path: "M0 0 H 90 V 90 H 0 L 0 0",
    fillColor: '#FF0000',
    fillOpacity: .5,
    anchor: new google.maps.Point(0, 0),
    strokeWeight: 0,
    scale: .5,
    rotation: 45
}

var marker = new google.maps.Marker({
    position: new google.maps.LatLng(0, 0),
    map: map,
    icon: symbol
});

【讨论】:

    猜你喜欢
    • 2017-04-10
    • 1970-01-01
    • 1970-01-01
    • 2017-11-29
    • 2013-12-20
    • 1970-01-01
    • 1970-01-01
    • 2014-02-25
    • 2012-02-08
    相关资源
    最近更新 更多