Javascript 如何基于新的lat、lon-onchange触发器更新谷歌地图的显示？

我正在编写一个脚本，一旦我输入了邮政编码，它就会更新地图的显示（onchange触发器）

请注意，映射已使用默认lat lon值初始化

到目前为止，脚本根据输入的邮政编码找到lat和lon（这很好），下面是我一直坚持的部分。我想根据这些新的lat/lon值更新地图的显示。所以我尝试初始化新地图，但这似乎根本不起作用

我该怎么办

到目前为止，我的代码是：

HTML

---

如果您有一个LatLng对象，您可以这样使用它：

map.setCenter（位置）

在您的情况下，在结果回调中：

map.setCenter（结果、几何、位置）

这将使地图在该位置居中。
您可以通过以下方式从值获取LatLng对象：

新的google.maps.LatLng（36.1694233，-115.1407836）
地图中myLatLon变量周围的括号，这就是问题所在，下面的工作代码

function find_Drlatlon() {

function roundNumber(num, dec) {
    return Math.round(num * Math.pow(10, dec)) / Math.pow(10, dec);
}
        var geocoder1 = new google.maps.Geocoder();
        geocoder1.geocode({
            address: $("#drpostcode").val() + ", UK"
        }, function(results, status) {
            if (results[0]) {
                var result = results[0];
                $("#lat1").val(roundNumber(result.geometry.location.lat(), 6));
                $("#lon1").val(roundNumber(result.geometry.location.lng(), 6));
                var lat1 = document.driverregform.lat1.value;
                var lon1 = document.driverregform.lon1.value;
                console.log(lat1);
                console.log(lon1);

  var myLatLng=new google.maps.LatLng(lat1,lon1); 
  console.log(myLatLng);             

  var citymap = {
    driverslocation: {
      center: myLatLng
    }
  };
    console.log(citymap);

    var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 8,
      center: myLatLng,
      mapTypeId: 'terrain'
    });


    for (var city in citymap) {
      var cityCircle = new google.maps.Circle({
        strokeColor: '#FF0000',
        strokeOpacity: 0.6,
        strokeWeight: 1,
        fillColor: '#FF0000',
        fillOpacity: 0.25,
        map: map,
        center: citymap[city].center,
        radius: 30000
      });
    }


            } else {}
        });
};

到目前为止，我不太确定如何在代码中实现它。。。。如果我将initMap（）作为一个独立的函数运行，它将非常有效。在onchange Trigger上似乎什么也没做在我看来函数initMap（）没有被触发，有什么建议吗？好的，排序好了，没有调用initMap（），工作正常，速度很快，我在一个很高的硬编码lat lon上测试它。现在我对将lat-lon值传递到映射有问题。。。。InvalidValueError:setCenter:不是LatLng或LatLngLiteral:在属性lat:不是数字中是否有更新的代码？设置结果变量后，代码进入回调体，因此在
var result=results[0]之后。另外：现在您正在设置输入字段的值（我想这很有用，如果您以后发布表单的话），但是您从刚刚设置的输入中检索值，这对我来说毫无意义。
function find_Drlatlon() {

function roundNumber(num, dec) {
    return Math.round(num * Math.pow(10, dec)) / Math.pow(10, dec);
}
        var geocoder1 = new google.maps.Geocoder();
        geocoder1.geocode({
            address: $("#drpostcode").val() + ", UK"
        }, function(results, status) {
            if (results[0]) {
                var result = results[0];
                $("#lat1").val(roundNumber(result.geometry.location.lat(), 6));
                $("#lon1").val(roundNumber(result.geometry.location.lng(), 6));
                var lat1 = document.driverregform.lat1.value;
                var lon1 = document.driverregform.lon1.value;
                console.log(lat1);
                console.log(lon1);

  var myLatLng=new google.maps.LatLng(lat1, lon1); 
  console.log(myLatLng);             

  var citymap = {
    driverslocation: {
      center: {myLatLng}
    }
  };
    console.log(citymap);

    var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 8,
      center: {myLatLng},
      mapTypeId: 'terrain'
    });


    for (var city in citymap) {
      var cityCircle = new google.maps.Circle({
        strokeColor: '#FF0000',
        strokeOpacity: 0.6,
        strokeWeight: 1,
        fillColor: '#FF0000',
        fillOpacity: 0.25,
        map: map,
        center: citymap[city].center,
        radius: 30000
      });
    }


            } else {}
        });
};

function find_Drlatlon() {

function roundNumber(num, dec) {
    return Math.round(num * Math.pow(10, dec)) / Math.pow(10, dec);
}
        var geocoder1 = new google.maps.Geocoder();
        geocoder1.geocode({
            address: $("#drpostcode").val() + ", UK"
        }, function(results, status) {
            if (results[0]) {
                var result = results[0];
                $("#lat1").val(roundNumber(result.geometry.location.lat(), 6));
                $("#lon1").val(roundNumber(result.geometry.location.lng(), 6));
                var lat1 = document.driverregform.lat1.value;
                var lon1 = document.driverregform.lon1.value;
                console.log(lat1);
                console.log(lon1);

  var myLatLng=new google.maps.LatLng(lat1,lon1); 
  console.log(myLatLng);             

  var citymap = {
    driverslocation: {
      center: myLatLng
    }
  };
    console.log(citymap);

    var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 8,
      center: myLatLng,
      mapTypeId: 'terrain'
    });


    for (var city in citymap) {
      var cityCircle = new google.maps.Circle({
        strokeColor: '#FF0000',
        strokeOpacity: 0.6,
        strokeWeight: 1,
        fillColor: '#FF0000',
        fillOpacity: 0.25,
        map: map,
        center: citymap[city].center,
        radius: 30000
      });
    }


            } else {}
        });
};