Question

我正在寻找可插入我的PhpStorm项目的地理定位API。

我需要一个首先加载世界上所有国家的下拉菜单，一旦选择了一个国家，另一个下拉菜单将根据上面选择的国家/地区填充省/州。在下降之后，将根据上面的省或州填充城市，最后是另一个下降，将填补上面列出的城市的负担。

Answer 1

这是您的完整解决方案

使用map api

https://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry,places&ext=.js

使用此css

http://vikku.info/programming/js/geodata-jsr-class.js

<div class='main'>

<h1></h1>

    <form id="myform">
        <div class="contents">
<b>*Select area</b>

            <p><span>Continent:</span> 
                <select name="continent" id="continent" onchange="getplaces(this.value,'country');">
                    <option value=""></option>
                </select>
            </p>
            <p><span>Country:</span> 
                <select name="country" id="country" onchange="getplaces(this.value,'province');">
                    <option value=""></option>
                </select>
            </p>
            <p><span>State / Provice:</span> 
                <select name="province" id="province" onchange="getplaces(this.value,'region')">
                    <option value=""></option>
                </select>
            </p>
            <p><span>County / Region:</span> 
                <select name="region" id="region" onchange="getplaces(this.value,'city')">
                    <option value=""></option>
                </select>
            </p>
            <p><span>City:</span> 
                <select name="city" id="city" onchange="zoomto(this.value);codeAddress(placedata[this.value].name)">
                    <option value=""></option>
                </select>
            </p>
        </div>
    </form>
    <div id="map_canvas"></div>

javascript


var whos = null;
var placedata = [];
var map;
var geocoder = new google.maps.Geocoder();

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);
            }
        } 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
        }
    });
};

这是一个小提琴：

http://jsfiddle.net/geocodezip/xq4h95ux/3/

如果您只是想要用户的IP地址和区域，那么就这样做

$.getJSON("http://ip-api.com/json/?callback=?", function (data) {
    console.log(data);
    $('#IP_Address').append("Your IP: " + data.query);
    $('#Country').append("Your Country: " + data.country);
    $('#City').append("Your City: " + data.city);
    $('#region').append("Your Region : " + data.region);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div id="IP_Address"></div>
<div id="Country"></div>
<div id="City"></div>
<div id="region"></div>

如果你想在php中获取这些信息，那么你可以使用

http://www.geoplugin.net/php.gp

如果您有IP地址，那么您可以像这样传递

http://www.geoplugin.net/php.gp?ip= $ youIpAddress

（对于本案例49.200.208.108）

它将转储

一个：18：{s:17:"geoplugin_request";s:14:"49.200.208.108";s:16:"geoplugin_status";i:200;s:16:"geoplugin_credit";s:145:"Some of the returned data includes GeoLite data created by MaxMind, available from <a href=\'http://www.maxmind.com\'>http://www.maxmind.com</a>.";s:14:"geoplugin_city";s:6:"Mumbai";s:16:"geoplugin_region";s:13:"Mahārāshtra";s:18:"geoplugin_areaCode";s:1:"0";s:17:"geoplugin_dmaCode";s:1:"0";s:21:"geoplugin_countryCode";s:2:"IN";s:21:"geoplugin_countryName";s:5:"India";s:23:"geoplugin_continentCode";s:2:"AS";s:18:"geoplugin_latitude";s:6:"18.975";s:19:"geoplugin_longitude";s:7:"72.8258";s:20:"geoplugin_regionCode";s:2:"16";s:20:"geoplugin_regionName";s:13:"Mahārāshtra";s:22:"geoplugin_currencyCode";s:3:"INR";s:24:"geoplugin_currencySymbol";s:7:"₨";s:29:"geoplugin_currencySymbol_UTF8";s:3:"₨";s:27:"geoplugin_currencyConverter";s:6:"66.695";}

反序列化获得的数据（或json_decode）并获取所有信息

我在哪里可以获得Geolocation API

1 个答案: