如何基于“文本框”值获取纬度和经度

Question

如何获取纬度和经度，具体取决于在文本框中插入的值。

为了在同一张地图上显示一些Pin。

文本框上的值将根据用户位置进行填充，因此，如果他想共享位置，则在我的网站中输入内容的人将显示在地图上

我希望当用户在要在地图中显示该图钉的文本框中指定纬度和经度时。 目前，以下脚本现在无法使用。 没有从文本框中获取值。

价值纬度：

<input type="text" name="val-lat" value="User Latitude" />

值经度：

<input type="text" name="val-lng" value="User Longitude" />

我使用以下脚本：

$(document).ready(function() {

    //------- Google Maps ---------//

    // Creating a LatLng object containing the coordinate for the center of the map
    var latlng = new google.maps.LatLng('val-lat', 'val-lng');

    // Creating an object literal containing the properties we want to pass to the map  
    var options = {  
        zoom: 15, // This number can be set to define the initial zoom level of the map
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP // This value can be set to define the map type ROADMAP/SATELLITE/HYBRID/TERRAIN
    };  
    // Calling the constructor, thereby initializing the map  
    var map = new google.maps.Map(document.getElementById('map_div'), options);  

    // Define Marker properties
    var image = new google.maps.MarkerImage('images/marker.png',
        // This marker is 129 pixels wide by 42 pixels tall.
        new google.maps.Size(129, 42),
        // The origin for this image is 0,0.
        new google.maps.Point(0,0),
        // The anchor for this image is the base of the flagpole at 18,42.
        new google.maps.Point(18, 42)
    );

    // Add Marker
    var marker1 = new google.maps.Marker({
        position: new google.maps.LatLng('val-lat', 'val-lng'), 
        map: map,       
        icon: image // This path is the custom pin to be shown. Remove this line and the proceeding comma to use default pin
    }); 

    // Add listener for a click on the pin
    google.maps.event.addListener(marker1, 'click', function() {  
        infowindow1.open(map, marker1);  
    });

    // Add information window
    var infowindow1 = new google.maps.InfoWindow({  
        content:  createInfo('Evoluted New Media', 'Ground Floor,<br />35 Lambert Street,<br />Sheffield,<br />South Yorkshire,<br />S3 7BH<br /><a href="http://www.evoluted.net" title="Click to view our website">Our Website</a>')
    }); 

    // Create information window
    function createInfo(title, content) {
        return '<div class="infowindow"><strong>'+ title +'</strong><br />'+content+'</div>';
    } 

});

Answer 1

这里的问题是您没有获得输入值。 尝试这个：

<input id="userLat" type="text" name="val-lat" value="User Latitude" />
<input id="userLng" type="text" name="val-lng" value="User Longitude" />

然后

var lat = document.getElementById('userLat').value;
var lng = document.getElementById('userLng').value;

var latlng = new google.maps.LatLng(lat, lng);