【问题标题】:after a geolocation google maps addlistener click stop working地理定位后 google maps addlistener 点击 stop working
【发布时间】:2017-10-26 13:17:53
【问题描述】:

我有一个表格来放置用户可以点击谷歌地图的地址,输入国家,庄园,县,地址会自动填写,但如果用户想用文本填写输入,自动地理定位地图。这两个功能都可以正常工作,但是在用户填写输入文本并完成地理定位后,如果我点击地图,addlistener 将不再工作。

整个代码很长,所以我把最重要的部分放在这里

function geolocalizarTM(){
console.log("entre en geolocalizarTM");
var gmap, divmap;
divmap = $('#map');
d1  = document.getElementById('direccion1').value; 
d2 = document.getElementById('direccion2').value; 
num = document.getElementById('numero').value; 
codp = document.getElementById('codigo_postal').value; 
prov = document.getElementById('provincia_id').value;
pob = document.getElementById('poblacion_id').value;
country = document.getElementById('pais_id').value;
if((d1!="")&& (codp!="")&&(prov!="")&&(pob!="")&&(country!="")){
    direccionText = d1 + "," + num + "," + codp + "," + prov + "," + pob + "," + country;                    
    $.ajax({
        type: "GET",
        url: "https://maps.googleapis.com/maps/api/geocode/json?address=" + direccionText + "&key=AIzaSyCy96_rJ419QasmI4RaJs3uHO-PUh-bNuc",
        dataType: "json",
        success: processJSON
    });
function processJSON(json) {
    lat = json.results[0].geometry.location.lat;
    lon = json.results[0].geometry.location.lng;

    latLon = new google.maps.LatLng(lat, lon);
    objConfig = new Object();

    objConfig.zoom = 18;
    objConfig.center = latLon;
    gmap = new google.maps.Map(divmap[0], objConfig);

    var marker = new google.maps.Marker({
        position: latLon,
        map: gmap,
    });
    directionsDisplay.setMap(gmap);
    marker.setMap(gmap);
    }
}
};


var ul = document.getElementById('panelContenedor');
var directionDisplay;
var directionsService;
var lat, lon, latLon, objConfig, ubicacionProd;
ubicacionProd = "";

var gmap, divmap;
divmap = $('#map');
showMap();
function showMap() {
    navigator.geolocation.getCurrentPosition(fn_ok, fn_error);
}
function fn_error() {
    console.log('geolocalizacion, ha ocurrido un error...');
}
function fn_ok(resp) {
    console.log("inicializo el mapa");
    lat = resp.coords.latitude;
    lon = resp.coords.longitude;
    latitud = document.getElementById("latitud").value;
    longitud = document.getElementById("longitud").value;
    if (latitud != "" && longitud != "") {
        lat = latitud;
        lon = longitud;
    }
   latLon = new google.maps.LatLng(lat, lon);
   objConfig = new Object();
   objConfig.zoom = 18;
   objConfig.center = latLon;
   gmap = new google.maps.Map(divmap[0], objConfig);

directionsService = new google.maps.DirectionsService();
directionsDisplay = new google.maps.DirectionsRenderer();
var marker = new google.maps.Marker({
    position: latLon,
});
directionsDisplay.setMap(gmap);

marker.setMap(gmap);

google.maps.event.addListener(gmap, 'click', function (e) {
    fx(e.latLng);
});

function fx(latLng) {
    console.log("pinche el mapa");
    marker.setMap(null);
    $('#localizacion').val(latLng);
    var request = {
        origin: latLng,
        destination: latLng,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };
    directionsService.route(request, function (response, status) {
        console.log(response);

    if (status == google.maps.DirectionsStatus.OK) {
        var point = response.routes[0].legs[0];
        marker.setOptions({map: gmap, position: point.start_location});
        gmap.setCenter(point.start_location);
        var direction = response.routes[0].legs[0].start_address.split(",");

    }
        /****aqui debo llenar los campos de la direccion****/
        console.log("Direccion: [0]" + direction[0] + "** [1]" + direction[1] + "** [2]" + direction[2] + "** [3]" + direction[3] + "** [4]" + direction[4] + '\n');
        var num_posiciones = direction.length; // determinamos el numero de campos que trae el arreglo
        /* blanqueo las cajitas*/
        $('#direccion1').val("");
        $('#direccion2').val("");
        $('#pais_id').val("");
        $('#provincia_id').val("");
        $('#numero').val("");
        $('#codigo_postal').val("");
        $('#poblacion_id').val("");
        /*

        ** here I fill the inputs ***

        */
    });
}
}

希望你能帮助我,非常感谢。

【问题讨论】:

标签: javascript php jquery google-maps geolocation


【解决方案1】:

我已经解决了这个问题。我是在处理Json函数之后没有调用函数fn_ok()。这就是 google.maps.event.addListener(gmap, 'click', function (e) 不起作用的原因。

所以,我希望这篇文章对某人有用。

【讨论】:

    猜你喜欢
    • 2023-02-04
    • 2018-07-22
    • 2012-06-13
    • 1970-01-01
    • 2012-04-30
    • 2018-08-10
    • 1970-01-01
    • 2016-08-21
    • 1970-01-01
    相关资源
    最近更新 更多