2012-03-26 25 views
5

Kämpfen den ganzen Tag mit der Einstellung einer Pfanne in Google Maps von einem Textlink. Es sieht so aus, als ob die ID der Map selbst nicht zur Funktion weitergeleitet wird, aber ich habe einige Dinge ohne Freude ausprobiert.google maps pan to

<script type="text/javascript"> 
    var home = new google.maps.LatLng(4.915833, 10.195313); 
    function initialize() { 
     var myOptions = { 
      zoom: 2, 
      center: home, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: false, 
      panControl: true, 
      panControlOptions: { 
       position: google.maps.ControlPosition.LEFT_CENTER 
      }, 
      zoomControl: true, 
      zoomControlOptions: { 
       style: google.maps.ZoomControlStyle.LARGE, 
       position: google.maps.ControlPosition.LEFT_CENTER 
      }, 
      scaleControl: false, 
      streetViewControl: true, 
      streetViewControlOptions: { 
       position: google.maps.ControlPosition.LEFT_CENTER 
      } 
     } 
     var map = new google.maps.Map(document.getElementById("map"), myOptions); 
     setMarkers(map, destinations); 
     clickroute(map); 
    } 
    var destinations = [ 
     ['Marbella', 36.509937, -4.886352], 
     ['Algarve', 37.016945, -7.928728], 
     ['London', 51.508129, -0.128005], 
     ['Istanbul', 41.00527, 28.97696], 
     ['Whistler', 50.116168, -122.959423] 
    ]; 
    function setMarkers(map, locations) { 
     var image = new google.maps.MarkerImage('img/marker.png', 
     new google.maps.Size(41, 63), 
     new google.maps.Point(0,0)); 
     for (var i = 0; i < locations.length; i++) { 
      var destination = locations[i]; 
      var myLatLng = new google.maps.LatLng(destination[1], destination[2]); 
      var marker = new google.maps.Marker({ 
       position: myLatLng, 
       map: map, 
       icon: image, 
       title: destination[0] 
      }); 
     } 
    } 
    function clickroute(lati, long) { 
     var latLng = new google.maps.LatLng(51.433373, -0.712251); 
     map.panTo(latLng); 
    } 
</script> 

<li onclick="clickroute()">test</li> 

Mögliche Ideen, was das Problem verursachen könnte? Ich erhalte eine js Fehler mit

Uncaught TypeError: Object #<HTMLDivElement> has no method 'panTo' 

Dank

Richard

Antwort

11

@onemach ist korrekt.

1. Sie müssen die map als eine globale Variable am Anfang von Javascript deklarieren. Machen Sie einfach eine var map; Erklärung unmittelbar nach <script type="text/javascript"> Tag.

2. Und zur gleichen Zeit sollten Sie Ihre Karte Initialisierung

map = new google.maps.Map(document.getElementById("map"), myOptions); // without the 'var' 

3. Ihr Aufruf clickroute() onClick von <li> ohne Parameter geändert werden. So ändern Sie die Definition von clickroute() wie folgt aus:

function clickroute() { //just omit the 'lati' and 'long' 
    var latLng = new google.maps.LatLng(51.433373, -0.712251); 
    map.panTo(latLng); 
} 

Jetzt auf dem test<li> Ihre Karte klicken, wird zu Punkt bewegen (51,433373, -0,712251)

2

clickroute(map); ist unvereinbar mit der Definition

function clickroute(lati, long) { 
    var latLng = new google.maps.LatLng(51.433373, -0.712251); 
    map.panTo(latLng); 
} 

Ich denke, was Sie wollen, dass es

function clickroute(map) { 
    var latLng = new google.maps.LatLng(51.433373, -0.712251); 
    map.panTo(latLng); 
} 

UPDATE:

Ich bin verwirrt, was genau Sie wollen.

onclick=clickroute() übergibt keine Argumente an die Funktion.

Auch gibt es keine globale map in Clickroute.

+0

Dank für die Zeit nehmen, um zu antworten, noch keine Freude mit, dass und der gleiche Fehler :( – user989952