使用目的地latlong計算源標記旋轉的度數或角度

-1

我使用JavaScript Google Google地圖API，用於顯示地圖，我有兩個markers，它帶有latlng Source,Destination。
我必須rotate我source 方向從destinationlatlng的基礎上。使用目的地latlong計算源標記旋轉的度數或角度

我用了source標記icon爲SVG符號路徑這裏是我的源圖標

<script> 
var carIcon = { 
    path: "M17.402,0H5.643C2.526,0,0,3.467,0,6.584v34.804c0,3.116,2.526,5.644,5.643,5.644h11.759c3.116,0,5.644-2.527,5.644-5.644 V6.584C23.044,3.467,20.518,0,17.402,0z M22.057,14.188v11.665l-2.729,0.351v-4.806L22.057,14.188z M20.625,10.773 c-1.016,3.9-2.219,8.51-2.219,8.51H4.638l-2.222-8.51C2.417,10.773,11.3,7.755,20.625,10.773z M3.748,21.713v4.492l-2.73-0.349 V14.502L3.748,21.713z M1.018,37.938V27.579l2.73,0.343v8.196L1.018,37.938z M2.575,40.882l2.218-3.336h13.771l2.219,3.336H2.575z M19.328,35.805v-7.872l2.729-0.355v10.048L19.328,35.805z",, 
    scale: .7, 
    strokeColor: '#9c9c9c', 
    strokeWeight: .10, 
    fillOpacity: 1, 
    fillColor: '#C21F25', 
    offset: '100%', 
    rotation: 50, 
    anchor: new google.maps.Point(10, 25) // orig 10,50 back of car, 10,0 front of car, 10,25 center of car 
}, 
</script>

代碼我知道上面roation選項更改標記旋轉。

我想要，
計算car marker度（角度）爲旋轉時，使用destination(green)標記latlng。

我當前結果中的第一張圖片和我想要的第二張圖片。

來源

2016-06-01 Hims

您可以使用谷歌地圖的幾何形狀庫計算兩個位置之間的標題：

var heading = google.maps.geometry.spherical.computeHeading(source, destination);

這裏是展示一個片段：

<!DOCTYPE html xmlns:xlink="http://www.w3.org/1999/xlink"> 
 

 
<head lang="en"> 
 
    <meta charset="UTF-8"> 
 
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry"></script> 
 
    <script> 
 
    var map; 
 
    var markers = []; 
 
    var carIcon = { 
 
     path: "M17.402,0H5.643C2.526,0,0,3.467,0,6.584v34.804c0,3.116,2.526,5.644,5.643,5.644h11.759c3.116,0,5.644-2.527,5.644-5.644 V6.584C23.044,3.467,20.518,0,17.402,0z M22.057,14.188v11.665l-2.729,0.351v-4.806L22.057,14.188z M20.625,10.773 c-1.016,3.9-2.219,8.51-2.219,8.51H4.638l-2.222-8.51C2.417,10.773,11.3,7.755,20.625,10.773z M3.748,21.713v4.492l-2.73-0.349 V14.502L3.748,21.713z M1.018,37.938V27.579l2.73,0.343v8.196L1.018,37.938z M2.575,40.882l2.218-3.336h13.771l2.219,3.336H2.575z M19.328,35.805v-7.872l2.729-0.355v10.048L19.328,35.805z", 
 
     scale: .7, 
 
     strokeColor: '#9c9c9c', 
 
     strokeWeight: .10, 
 
     fillOpacity: 1, 
 
     fillColor: '#C21F25', 
 
     offset: '100%', 
 
     rotation: 0, 
 
     anchor: new google.maps.Point(10, 25) // orig 10,50 back of car, 10,0 front of car, 10,25 center of car 
 
    }; 
 

 
    function initialize() { 
 
     var losAngeles = new google.maps.LatLng(34.0500, -118.2500); 
 
     var pasadena = new google.maps.LatLng(34.14778, -118.14452); 
 
     var mapOptions = { 
 
     zoom: 10, 
 
     center: losAngeles, 
 
     disableDefaultUI: true, 
 
     mapTypeControlOptions: google.maps.MapTypeId.SATELLITE 
 
     }; 
 
     map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
 
     addMarker(losAngeles); 
 
     var heading = google.maps.geometry.spherical.computeHeading(pasadena, losAngeles); 
 
     addCarIcon(pasadena, heading) 
 
    } 
 

 
    function addMarker(location) { 
 
     var markerOptions = { 
 
     position: location, 
 
     map: map 
 
     }; 
 
     var marker = new google.maps.Marker(markerOptions); 
 
    } 
 

 
    function addCarIcon(location, heading) { 
 
     console.log(heading) 
 
     carIcon.rotation = heading; 
 
     var marker = new google.maps.Marker({ 
 
     position: location, 
 
     map: map, 
 
     draggable: false, 
 
     icon: carIcon 
 
     }); 
 
    } 
 

 
    google.maps.event.addDomListener(window, 'load', initialize); 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <div id="map-canvas" style="width:600px;height:300px"></div> 
 
</body> 
 

 
</html>

來源

2016-06-05 14:05:42 brenzy

使用目的地latlong計算源標記旋轉的度數或角度

回答

相關問題