xml/json出力の高速道路出口/マイル市場を表示するGoogle Maps API？

Question

私は、車両がルート内を移動した距離、最長距離、ルートがポイントAからB、ループかどうか、または車両が単にアイドル状態にあったかどうかを測定するためのスクリプトを開発しました。

私はGoogleMaps APIを使用してこれをすべて確認し、XMLデータを検索して車両の現在地を特定しています。現在の都市がその長い/緯度座標に何であるかを示す「近傍」タグがあります。

現在のハイウェイ出口またはマイルマーカーについては何も表示されません。誰でもGoogleからこの情報を取得する方法を知っていますか？

これまでに質問された場合はお詫び申し上げます。私は同様の投稿を見つけましたが、7年前からあり、現在GoogleMapsはそのようなサービスを提供していないと述べています。

Answer 1

かなりうまくいくと思います。
ダブルマーカを作成することがあります（2マージマーカーのように数ヤード離れます）。

おそらく使用されていないいくつかの余分なコードがあり、いくつかのコメントがあります。 私が取り組んでいた別のプロジェクトからこのほとんどをコピー/ペーストしました。

<style> 
body { 
    width: 100%; 
} 
#right-panel, #map { 
    height: 400px; 
    width: 50%; 
    float: left; 
    overflow: auto; 
} 
hr { 
    clear: both; 
} 
</style> 

<input id="from" placeholder="from" value="Tulsa"/> 
<input id="to" placeholder="to" value="Chicago"/> 
<select onchange="routeType(this)"> 
    <option value="DRIVING">DRIVING</option> 
    <option value="WALKING">WALKING</option> 
    <option value="BICYCLING">BICYCLING</option> 
    <option value="TRANSIT">TRANSIT</option> 
</select> 
<input value="plot" onclick="calculateRoute()" type="button"/> 
<hr/> 
<div id="map"></div> 
<div id="right-panel"></div> 
<hr/> 
<input onclick="calculateRoute()" value="GO" type="button"/> 
<div id="maplog"></div> 
<script type="text/javascript" src="https://maps.google.com/maps/api/js?libraries=geometry"></script> 
<script> 
var map; 
var here = {}; 
var dest = {}; 
var directionsService; 
var directionsDisplay; 
var travelMode = 'DRIVING'; //'WALKING'; 
var sourcePosition; 

function initMap() { 
    map = new google.maps.Map(document.getElementById('map'), { 
     center: {lat: 35, lng: -100}, 
     zoom: 5, 
     mapTypeId: 'terrain' 
    }); 
    var marker = new google.maps.Marker({ 
     position: {lat: 50.8735506, lng: 4.3238525}, 
     map: map, 
     title: 'Fermenthings winkel' 
    }); 
    dest.marker = marker; 
    directionsService = new google.maps.DirectionsService; 
    directionsDisplay = new google.maps.DirectionsRenderer({ 
     draggable: true, 
     suppressMarkers: true, 
     panel: document.getElementById('right-panel'), 
     map: map 
    }); 
} 
function trackLocation() { 
    getLocation(); 

} 
google.maps.event.addDomListener(window, 'load', initMap); 


function getLocation() { 
    if (navigator.geolocation) { 
     navigator.geolocation.getCurrentPosition(showPosition); 
    } else { 
    //x.innerHTML = "Geolocation is not supported by this browser."; 
    } 
} 
function showPosition(position) { 
// x.innerHTML = "Latitude: " + position.coords.latitude + 
// "<br>Longitude: " + position.coords.longitude; 
    if(map) { 

     sourcePosition = {lat: position.coords.latitude, lng: position.coords.longitude}; 
     //map.setCenter(sourcePosition); 
     if(here.marker) { 
      here.marker.setMap(null); 
     } 
     here.marker = new google.maps.Marker({ 
      position: sourcePosition, 
      draggable: true, 
      icon: {url: 'thumbnails/here.png'}, 
      map: map 
     }); 
     var bounds = new google.maps.LatLngBounds(); 
     bounds.extend(sourcePosition); 
     bounds.extend(dest.marker.getPosition()); 
     map.fitBounds(bounds); 
     google.maps.event.addListener(here.marker, 'position_changed', function() { 
      sourcePosition = {lat: this.getPosition().lat(), lng: this.getPosition().lng()}; 
     }); 
     google.maps.event.addListener(here.marker, 'dragend', function() { 
      sourcePosition = {lat: this.getPosition().lat(), lng: this.getPosition().lng()}; 
      calculateRoute(); 
     }); 

     //return; 
    } 
    // route 
    calculateRoute(); 
} 

function createMarker(lat, lng, title) { 
    return new google.maps.Marker({ 
     position: {lat: lat, lng: lng}, 
     map: map, 
     title: title 
    }); 
} 
function displayRoute(origin, destination, service, display, waypoints, callback) { 
    if(waypoints) { 
     var options = { 
      origin: origin, 
      destination: destination, 
      waypoints: waypoints, 
      travelMode: travelMode //'DRIVING', 
     }; 
    } 
    else { 
     var options = { 
      origin: origin, 
      destination: destination, 
      travelMode: travelMode //'DRIVING', 
     }; 
    } 
    service.route(options, function(response, status) { 
     if (status === 'OK') { 
      // 
      //createMarkers(response, callback); 
      display.setDirections(response); 
      if(callback) { 
       callback(response); 
      } 
     } else { 
      // alert('Could not display directions due to: ' + status); 
     } 
    }); 
} 

function routeType(elm) { 
    travelMode = elm.value; 
    if(sourcePosition) { 
     calculateRoute(); 
    } 
} 

function calculateRoute() { 
    var from = document.getElementById('from').value; 
    var to = document.getElementById('to').value; 

    displayRoute(
     from, 
     to, 
     directionsService, 
     directionsDisplay, 
     null, //waypoints, 
     function(response) { 
      // loop steps 
      var steps = response.routes[0].legs[0].steps; 
      for(var i = 0; i<steps.length; i++) { 
      var step = response.routes[0].legs[0].steps[i]; 
      // search for keywords in the instructions 
      if((step.instructions.indexOf('Take') > -1 || step.instructions.indexOf('take') > -1) && step.instructions.indexOf('exit') > -1) { 
       //here we enter a highway 
       document.getElementById('maplog').innerHTML += 'exit: ' + step.start_location.lat() +','+ step.start_location.lng() +'<br/>'; 
       createMarker(step.start_location.lat(), step.start_location.lng(), 'exit'); 
      } 
      if((step.instructions.indexOf('Merge') > -1 || step.instructions.indexOf('merge') > -1) && step.instructions.indexOf('onto') > -1) { 
       //here we exit a highway 
       document.getElementById('maplog').innerHTML += 'merge: ' + step.start_location.lat() +','+ step.start_location.lng() +'<br/>'; 
       createMarker(step.start_location.lat(), step.start_location.lng(), 'merge'); 
      } 
      } 
      //document.getElementById('maplog').innerHTML = JSON.stringify(response); 
     } 
    ); 
} 
</script>