Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/440.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 如何在实时拖动标记中反转地理编码和重新填充菜单_Javascript_Google Maps_Drop Down Menu_Google Maps Markers_Reverse Geocoding - Fatal编程技术网

Javascript 如何在实时拖动标记中反转地理编码和重新填充菜单

Javascript 如何在实时拖动标记中反转地理编码和重新填充菜单,javascript,google-maps,drop-down-menu,google-maps-markers,reverse-geocoding,Javascript,Google Maps,Drop Down Menu,Google Maps Markers,Reverse Geocoding,我有以下javascript代码: function getLatLng() { var geocoder = new google.maps.Geocoder(); var address = document.getElementById('address2').value; var input = document.getElementById('address2'); var options = { types: [], }; var

我有以下javascript代码:

function getLatLng() {
    var geocoder = new google.maps.Geocoder();
    var address = document.getElementById('address2').value;

     var input = document.getElementById('address2');
    var options = {
    types: [],
    };

var autocomplete = new google.maps.places.Autocomplete(input, options);

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
function getLatLng2() {
    var geocoder = new google.maps.Geocoder();
    var e = document.getElementById('city');
var address = e.options[e.selectedIndex].text;

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
function getLatLng3() {
    var geocoder = new google.maps.Geocoder();
    var e = document.getElementById('region');
var address = e.options[e.selectedIndex].text;

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
function getLatLng4() {
    var geocoder = new google.maps.Geocoder();
    var e = document.getElementById('province');
var address = e.options[e.selectedIndex].text;

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
function getLatLng5() {
    var geocoder = new google.maps.Geocoder();
    var e = document.getElementById('country');
var address = e.options[e.selectedIndex].text;

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
function getLatLng6() {
    var geocoder = new google.maps.Geocoder();
    var e = document.getElementById('continent');
var address = e.options[e.selectedIndex].text;

    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var latLng = results[0].geometry.location;
            $('#lat').val(results[0].geometry.location.lat());
            $('#lng').val(results[0].geometry.location.lng());
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}
//

var whos = null;
var placedata = [];
var geocoder = new google.maps.Geocoder();
var map;
function getplaces(gid, src) {
    if ( !! placedata[gid]) {
        map.setCenter({
            lat: parseFloat(placedata[gid].lat),
            lng: parseFloat(placedata[gid].lng)
        });
        switch (src) {
            case "continent":
                map.setZoom(3);
                break;
            case "country":
                map.setZoom(5);
                break;
            case "province":
                map.setZoom(6);
                break;
            case "region":
                map.setZoom(7);
                break;
            case "city":
                map.setZoom(8);
                break;
        }
        codeAddress(placedata[gid].name);
    }

    whos = src;


    //  var  request = "http://ws.geonames.org/childrenJSON?geonameId="+gid+"&callback=getLocation&style=long";
    var request = "http://www.geonames.org/childrenJSON?geonameId=" + gid + "&callback=listPlaces&style=long";
    aObj = new JSONscriptRequest(request);
    aObj.buildScriptTag();
    aObj.addScriptTag();
}

function listPlaces(jData) {
    counts = jData.geonames.length < jData.totalResultsCount ? jData.geonames.length : jData.totalResultsCount;
    who = document.getElementById(whos);
    who.options.length = 0;

    if (counts) who.options[who.options.length] = new Option('Select', '');
    else who.options[who.options.length] = new Option('No Data Available', 'NULL');

    for (var i = 0; i < counts; i++) {
        who.options[who.options.length] = new Option(jData.geonames[i].name, jData.geonames[i].geonameId);
        placedata[jData.geonames[i].geonameId] = jData.geonames[i];
    }

    delete jData;
    jData = null;
}
function zoomto(gid) {
   if ( !! placedata[gid]) {
        map.setCenter({
            lat: parseFloat(placedata[gid].lat),
            lng: parseFloat(placedata[gid].lng)
        });
       map.setZoom(14);
   }
}

function codeAddress(address) {   
    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            if (!!results && !!results[0] && !!results[0].geometry && !!results[0].geometry.viewport) {
                map.fitBounds(results[0].geometry.viewport);
            } else if (!!results && !!results[0] && !!results[0].geometry && !!results.geometry.bounds) {
                map.fitBounds(results[0].geometry.bounds);
            } else {
                map.setCenter(results[0].geometry.location);
            }
 var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
      });          

        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}

function codeAddress2() {
  var address = document.getElementById('address2').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker({
          map: map,
          position: results[0].geometry.location
      });
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}


window.onload = function () {
    getplaces(6295630, 'continent');
    map = new google.maps.Map(document.getElementById('map_canvas'), {
        zoom: 3,
        center: {
            lat: 0,
            lng: 0
        }
    });
};

移动地图上的标记我想在菜单中实时更改大陆、州、城市等。可能吗?如何搜索?

您可以在下拉“选项”中搜索地理编码器返回的结果。由于数据可能来自不同的来源,它可能找不到正确的结果,但这对我来说是可行的(至少对于Wichita,KS),尽管它需要每个地址组件进行拖动。此时,要改变这一点,您需要重构代码

function setDropdown(menuId, string) {
  var menu = document.getElementById(menuId);
  var selectedIndex = menu.selectedIndex;
  for (var option = 0; option < menu.options.length; option++) {
    if (nodeValue(menu.options[option]).indexOf(string) != -1) {
      if (selectedIndex != option) {
        menu.options[option].setAttribute("selected", "selected");
        menu.onchange();
      }
      break;
    }
  }
}

function displayAddress(address) {
  for (var p = address.length - 1; p >= 0; p--) {
    for (var t = 0; t < address[p].types.length; t++) {
      if (address[p].types[t] == "country") {
        setDropdown('country', address[p].long_name);
      }
      if (address[p].types[t] == "administrative_area_level_1") {
        console.log("admin_area_level_1=" + address[p].long_name);
        setDropdown('province', address[p].long_name)
      }
      if (address[p].types[t] == "administrative_area_level_2") {
        console.log("admin_area_level_2=" + address[p].long_name);
        setDropdown('region', address[p].long_name)
      }
      if (address[p].types[t] == "locality") {
        console.log("locality=" + address[p].long_name);
        setDropdown('city', address[p].long_name);
      }
    }
  }
}
函数设置下拉列表(menuId,字符串){
var menu=document.getElementById(menuId);
var selectedIndex=菜单。selectedIndex;
对于(var option=0;option=0;p--){
对于(var t=0;t

geonames.org,从未听说过,但它看起来可能很有趣。看看这是否有帮助:拖动标记后,它将地址组件放入输入元素中;寻找我的答案好的,我会尝试调整你的代码可能重复的,我认为这将是很难重新填充下拉菜单,因为下拉菜单取决于不同的api。固定现有小提琴
function setDropdown(menuId, string) {
  var menu = document.getElementById(menuId);
  var selectedIndex = menu.selectedIndex;
  for (var option = 0; option < menu.options.length; option++) {
    if (nodeValue(menu.options[option]).indexOf(string) != -1) {
      if (selectedIndex != option) {
        menu.options[option].setAttribute("selected", "selected");
        menu.onchange();
      }
      break;
    }
  }
}

function displayAddress(address) {
  for (var p = address.length - 1; p >= 0; p--) {
    for (var t = 0; t < address[p].types.length; t++) {
      if (address[p].types[t] == "country") {
        setDropdown('country', address[p].long_name);
      }
      if (address[p].types[t] == "administrative_area_level_1") {
        console.log("admin_area_level_1=" + address[p].long_name);
        setDropdown('province', address[p].long_name)
      }
      if (address[p].types[t] == "administrative_area_level_2") {
        console.log("admin_area_level_2=" + address[p].long_name);
        setDropdown('region', address[p].long_name)
      }
      if (address[p].types[t] == "locality") {
        console.log("locality=" + address[p].long_name);
        setDropdown('city', address[p].long_name);
      }
    }
  }
}