Làm cách nào để xoay điểm đánh dấu trong Google Maps?

Question

Sau đây là mã để xoay điểm đánh dấu, nhưng cách xoay một điểm đánh dấu tùy chỉnh. Bất kỳ ý tưởng?

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

Answer 1

Các API reference không nói bất cứ điều gì cụ thể về luân chuyển được thực hiện như thế nào nhưng vì path mất một phần tử SVG Tôi muốn nói thats cách họ quản lý để xoay nó. Nếu bạn tạo điểm đánh dấu tùy chỉnh của mình bằng cách sử dụng SVG, nó có thể được thực hiện khá dễ dàng bằng cách sử dụng transform="rotate(deg centerX centerY").

Answer 2

Bạn có thể sử dụng chức năng sau đây để xoay hình ảnh, yếu tố là hình ảnh và mức độ là góc bạn muốn xoay, zero là khi một mũi tên lên ở phía bắc:

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

Trân trọng ,

Chen

Answer 3

xoay vòng có sẵn trong 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, 
    ... 
});