Как повернуть маркер в Картах Google?

Ниже приведен код для поворота маркера, но как вращать пользовательский маркер. Любая идея?

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
    }  
});

Ответы

Ответ 1

Ссылка API не говорит ничего конкретно о том, как происходит ротация, но поскольку path принимает SVG-элемент, я бы сказал это то, как им удается вращать его. Если вы создаете свой собственный маркер с помощью SVG, это можно сделать довольно легко, используя transform="rotate(deg centerX centerY").

Ответ 2

вращение доступно в 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,
  ...
});

Ответ 3

Вы можете использовать следующую функцию для поворота изображения, элемент - это изображение, а степень - это угол, который вы хотели бы вращать, ноль - это когда стрелка находится на севере:

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)";
    }
}

С уважением,

Chen