使用google maps api为经度和纬度使用变量

Question

我刚开始使用谷歌地图API浏览器,但当我将变量放在经度/纬度位置而不是直接放置数字时,我似乎无法使其工作.

我需要从两个输入元素的值填充地图.

它不适用于变量,但如果将函数中的变量更改为数字,则它可以完美地工作.

是的我知道我不应该发布我的API密钥,但这是我在关闭帐户上用于测试的一个,我将最终删除它.

function initialize() {
        var userLng = $('#lng').val();
	var userLat = $('#lat').val();
  
	var mapOptions = {
	    center: { lat: userLat, lng: userLng },
	    zoom: 8
	};
	var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

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

#map-canvas {
  height: 30em;
  width: 30em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCgxY6DqJ4TxnRfKjlZR8SfLSQRtOSTxEU"></script>
<form>
  <input type="text" id="lng" name="lng" value="30">
  <input type="text" id="lat" name="lat" value="40">
</form>

<div id="map-canvas"></div>

Answer 1

您正在使用字符串,请尝试使用浮点数:

var userLng = parseFloat($('#lng').val());
var userLat = parseFloat($('#lat').val());
var mapOptions = {
        center: { lat: userLat, lng: userLng },
        zoom: 8
    };