22

以下是旋转标记的代码,但如何旋转自定义标记。任何想法?

var angleDegrees = 150;
new google.maps.Marker({
    position: a,
    map: map,
    icon: {
        path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
        scale: 6,
        fillColor: "red",
        fillOpacity: 0.8,
        strokeWeight: 2,
        rotation: angleDegrees //this is how to rotate the pointer
    }  
});
4

3 回答 3

25

旋转在 API 中可用。 https://developers.google.com/maps/documentation/javascript/examples/overlay-symbol-custom

var icon = {
    ...
    path: '...',
    scale: 1,
    rotation: [degrees]
};

marker = new google.maps.Marker({
  map: [...],
  icon: icon,
  ...
});
于 2014-05-16T13:07:29.677 回答
4

API 参考并没有具体说明旋转是如何完成的,但是由于需要path一个 SVG 元素,我会说这就是他们如何设法旋转它。如果您使用 SVG 创建自定义标记,则可以使用transform="rotate(deg centerX centerY").

于 2013-09-23T04:43:34.300 回答
0

您可以使用以下函数来旋转图像,元素是图像,度数是您要旋转的角度,零是箭头指向北方时:

function (element, degree) {
    if (navigator.userAgent.match("Chrome")) {
       element.style.WebkitTransform = "rotate(" + degree + "deg)";
    }
    else if (navigator.userAgent.match("Firefox")) {
       element.style.MozTransform = "rotate(" + degree + "deg)";
    }
    else if (navigator.userAgent.match("MSIE")) {
       element.style.msTransform = "rotate(" + degree + "deg)";
    }
    else if (navigator.userAgent.match("Opera")) {
       element.style.OTransform = "rotate(" + degree + "deg)";
    }
    else {
       element.style.transform = "rotate(" + degree + "deg)";
    }
}

此致,

于 2013-11-23T22:43:09.093 回答