문제

I can update the google map marker position but I cannot update the google map position. It does not centres the map to the latitude and longitude position given

var myLatlng;
var map;
var infowindow;
var latitude;
var longtitude;
var marker;

loadMap();
function loadMap()
{
    myLatlng = new google.maps.LatLng(54.91252, -1.37664);

    var mapOptions = {
        zoom: 17,
        center: myLatlng
    };

    map = new google.maps.Map(document.getElementById("googlemaps"), mapOptions);
    var contentString = '<h5>The Mew </h5>';

    infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
        title: "The Mew",
        animation: google.maps.Animation.DROP
    });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map, marker);
    });
    infowindow.open(map, marker);
}

function updatePosition()
{
    latitude = document.getElementById('latitude');
    longtitude = document.getElementById('longtitude');
    myLatlng = new google.maps.LatLng(latitude, longtitude);
    marker.setPosition(myLatlng);
    map.setCenter(myLatlng);
}



  <input type="text" id="latitude" />
   <input type="text" id="longtitude" />
   <a onclick="updatePosition()" >update </a>
도움이 되었습니까?

해결책

In updatePosition the information you're assigning to latitude and longitude are the DOM nodes of those input fields but you want to assign the value of those inputs instead. Also, you need to ensure that the text you're grabbing from those values is converted to a number for LatLng to accept them properly. You can use parseInt for that. Don't forget the radix.

function updatePosition() {
  latitude = parseInt(document.getElementById('latitude').value, 10);
  longtitude = parseInt(document.getElementById('longtitude').value, 10);
  myLatlng = new google.maps.LatLng(latitude, longtitude);
  marker.setPosition(myLatlng);
  map.setCenter(myLatlng);
}

다른 팁

You can use jQuery to get values of inputs

function updatePosition()
 {
   var lat= $('#latitude').val();
   var lng= $('#longtitude').val();
   myLatlng = new google.maps.LatLng(lat,lng);
   marker.setPosition(myLatlng);
   map.setCenter(myLatlng);
 } 

and in Javascript you have to use parseInt which will parse string and return a integer

  lat = parseInt(document.getElementById('latitude').value,10);
  lng = parseInt(document.getElementById('longtitude').value,10); 

FIDDLE DEMO

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top