標記沒有顯示在谷歌地圖api

-1

我有一個地圖，給出了基於地理定位的方向，但我想要一個標記甚至在用戶獲得方向之前在地圖上。我似乎無法讓網頁加載時顯示標記。我正在使用的代碼如下：標記沒有顯示在谷歌地圖api

<script src="http://maps.google.com/maps/api/js?sensor=true"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script> 

var directionDisplay, map; 
    function calculateRoute(from, to) { 
    // Center initialized to Lafayette IN 
    var travelMode = $('input[name="travelMode"]:checked').val(); 
    var myOptions = { 
     zoom: 10, 
     center: new google.maps.LatLng(40.40541,-86.89048), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var panel = document.getElementById("directionsPanel"); 
    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(40.40541,-86.89048), 
    map: map, 
    title: "Beyond the Box" 
    }); 
    marker.setMap(map); 
    // Draw the map 
    var mapObject = new google.maps.Map(document.getElementById("map"), myOptions); 

    var directionsService = new google.maps.DirectionsService(); 
    var directionsRequest = { 
     origin: from, 
     destination: to, 
     travelMode: google.maps.DirectionsTravelMode[travelMode], 
     unitSystem: google.maps.UnitSystem.IMPERIAL 
    }; 
    directionsService.route(
     directionsRequest, 
     function(response, status) 
     { 
     if (status == google.maps.DirectionsStatus.OK) 
     { 
      new google.maps.DirectionsRenderer({ 
      map: mapObject, 
      directions: response, 
      }); 
     } 
     if (status == google.maps.DirectionsStatus.OK) 
     { 
      directionsDisplay = new google.maps.DirectionsRenderer({ 
      map: mapObject, 
      directions: response, 
      }); 
      directionsDisplay.setPanel(panel); 
     } 
     else 
      $("#error").append("Unable to retrieve your route<br />"); 
     } 
    ); 
    } 

    $(document).ready(function() { 
    // If the browser supports the Geolocation API 
    if (typeof navigator.geolocation == "undefined") { 
     $("#error").text("Your browser doesn't support the Geolocation API"); 
     return; 
    } 

    $("#from-link, #to-link").click(function(event) { 
     event.preventDefault(); 
     var addressId = this.id.substring(0, this.id.indexOf("-")); 

     navigator.geolocation.getCurrentPosition(function(position) { 
     var geocoder = new google.maps.Geocoder(); 
     geocoder.geocode({ 
      "location": new google.maps.LatLng(position.coords.latitude,  position.coords.longitude) 
     }, 
     function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) 
      $("#" + addressId).val(results[0].formatted_address); 
      else 
      $("#error").append("Unable to retrieve your address<br />"); 
     }); 
     }, 
     function(positionError){ 
     $("#error").append("Error: " + positionError.message + "<br />"); 
     }, 
     { 
     enableHighAccuracy: true, 
     timeout: 10 * 1000 // 10 seconds 
     }); 
    }); 

    $("#calculate-route").submit(function(event) { 
     event.preventDefault(); 
     calculateRoute($("#from").val(), $("#to").val()); 
    }); 
    }); 
    google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
</head> 
<body> 
<body onLoad="calculateRoute()"> 
<!-- Start Header --> 
<?php include("header.php"); ?> 
<!-- End Header -->

來源

2013-10-22 user2905145

我在代碼中看到的唯一標記是calculateRoute函數中的。你說「我想要一個標記在地圖上，甚至在用戶獲得路線之前」，你如何期待這個工作？你有什麼嘗試？ – geocodezip

我對不知道JavaScript的道歉。我盡我所能將事物拼湊在一起並製作工作地圖，這在很大程度上要歸功於您在此論壇上提供的關於其他人以往問題的很多答案。如果不是像你和Max這樣的偉大人物，我會花更多的時間去解決這些問題。 – user2905145

您沒有初始化「map」變量。試試這個。

var mapObject = new google.maps.Map(document.getElementById("map"), myOptions); 
marker.setMap(mapObject);

來源

2013-10-22 20:38:12 Max

這對我想要達到的目標非常合適。謝謝Max。 – user2905145

標記沒有顯示在谷歌地圖api

回答

相關問題