Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/72.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 更改谷歌地图API半径_Javascript_Jquery_Google Maps_Google Maps Api 3 - Fatal编程技术网

Javascript 更改谷歌地图API半径

Javascript 更改谷歌地图API半径,javascript,jquery,google-maps,google-maps-api-3,Javascript,Jquery,Google Maps,Google Maps Api 3,我正在尝试更改google maps API上现有的圆半径。我正在使用,但下面是我尝试做的一个简单片段: $('#map').locationpicker({ location: { latitude: initLat, longitude: initLon }, radius: initRadius, zoom: initZoom,

我正在尝试更改google maps API上现有的圆半径。我正在使用,但下面是我尝试做的一个简单片段:

$('#map').locationpicker({
            location: {
                latitude: initLat,
                longitude: initLon
            },
            radius: initRadius,
            zoom: initZoom,
            inputBinding: {
                latitudeInput: $('#map-lat'),
                longitudeInput: $('#map-lon'),
                locationNameInput: $('#map-address'),
                radiusInput: $('#map-radius')
            },
            onchanged: function (currentLocation, radius, isMarkerDropped) {
                var mapContext = $('#map').locationpicker('map');
                mapContext.marker.setVisible(true);
                mapContext.map.setZoom(13);

                //CHANGE RADIUS HERE
                mapContext.circle.setRadius(###);

            },
            enableAutocomplete: true,
            addressFormat: 'street_address',
            autocompleteOptions: {
                componentRestrictions: { country: 'us' }
            }
        });

onchanged事件中的所有其他内容都正常工作,我尝试了各种方法,但都没有成功。

查看,似乎没有外部可用的方法可以直接访问圆圈(当前)。更改与其链接的输入的值会更改半径。代码是开源的,因此您可以对其进行修改,以允许直接访问
google.maps.Circle
对象。

找到了一个临时解决方案,不确定它是否正确,但它可以工作。这只是强制更改事件,就像用户手动输入新半径一样,但仅当删除标记或输入新地址时

Location:
<input type="text" id="map-address" style="width: 200px" />
Radius:
<input type="text" id="map-radius" />mi
<input type="hidden" id="map-lat" />
<input type="hidden" id="map-lon" />
<div id="map" style="width: 500px; height: 400px;" />
<script>
    var iteration = 0;
    var initLat = 37.963922;
    var initLon = -95.966002;
    var initZoom = 3;
    var initRadius = 0;

    $('#map').locationpicker({
        location: {
            latitude: initLat,
            longitude: initLon
        },
        radius: initRadius,
        zoom: initZoom,
        inputBinding: {
            latitudeInput: $('#map-lat'),
            longitudeInput: $('#map-lon'),
            locationNameInput: $('#map-address'),
            radiusInput: $('#map-radius')
        },
        onchanged: function (currentLocation, radius, isMarkerDropped) {
            var mapContext = $('#map').locationpicker('map');
            mapContext.marker.setVisible(true);
            mapContext.map.setZoom(13);

            $("#map-address").change(function(){
                iteration = 0;
            });

            if (iteration < 1 && radius > 1) {
                radius = 1;
                var map_rad = document.getElementById("map-radius");
                map_rad.value = radius;
                map_rad.dispatchEvent(new Event('change'));
                iteration++;
            }
        },
        enableAutocomplete: true,
        addressFormat: 'street_address',
        autocompleteOptions: {
            componentRestrictions: { country: 'us' }
        }
    });
</script>
位置:
半径:
惯性矩
var迭代=0;
var initLat=37.963922;
var initLon=-95.966002;
var-initZoom=3;
var initRadius=0;
$(“#映射”).locationpicker({
地点:{
纬度:initLat,
经度:initLon
},
半径:初始半径,
缩放:初始化缩放,
输入绑定:{
纬度输入:$(“#地图纬度”),
纵向输入:$(“#映射lon”),
locationNameInput:$(“#映射地址”),
半径输入:$(“#贴图半径”)
},
onchanged:函数(当前位置、半径、isMarkerDroped){
var mapContext=$('#map')。locationpicker('map');
mapContext.marker.setVisible(true);
mapContext.map.setZoom(13);
$(“#映射地址”).change(函数(){
迭代=0;
});
if(迭代<1&&radius>1){
半径=1;
var map_rad=document.getElementById(“映射半径”);
地图半径值=半径;
地图无线电调度事件(新事件(“变更”);
迭代++;
}
},
enableAutocomplete:正确,
addressFormat:'街道地址',
自动完成选项:{
组件限制:{国家:'us'}
}
});

特别感谢

什么是“####”?是字符串还是数字?javascript控制台中有任何有趣的输出吗?####是以米为单位的数字。控制台显示:“未捕获类型错误:无法读取未定义的属性‘setRadius’”,正如我在回答中指出的,没有
圆圈
mapContext的属性