Visualizzazione risultati 1 fino 13 di 13

Discussione: [PHP]IP to location tramite JSON

  1. #1
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito [PHP]IP to location tramite JSON

    Ciao,
    Come faccio a fare in modo che il seguente codice
    Codice:
    <html>
        <head>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        </head>
        <body>
    <!--Free usage of our API is limited to 1,000 API requests per day. If you exceed 1,000 requests in a 24 hour period we'll return a 429 HTTP status code to you. If you need to make more requests, or need SSL support, see our paid plans, which all have soft limits.-->
            <hr/>
            <div id="ip"></div>
            <div id="address"></div>
    
            <input type="text" value="" id="city" />
    
            <script type="text/javascript">
            $.get("http://ipinfo.io", function (response) {
                $("#address").html("Location: " + response.ip + ", "+ response.city + ", "+ response.region + ", " + response.country);
                $("#details").html(JSON.stringify(response, null, 4));
                $("#city").html(response.city);
                document.getElementById('city').value = response.city;
            }, "jsonp");
            </script>
        </body>
    </html>
    visualizzi ad es.
    Codice:
    8.8.8.8, Mountain View, California, US
    
    dove l'immagine punta a:
    Codice:
    http://maps.googleapis.com/maps/api/staticmap?visible=42.402354,12.862117|$loc&zoom=2&size=640x640&scale=4&format=png&maptype=road&markers=size:big|color:red|label:V|$loc&visual_refresh=true
    e dove "$loc" è una variabile che assume il valore del campo "loc" fornito dal json
    per rimanere nell'esempio di 8.8.8.8 loc è uguale a 37.3860,-122.0838

    spero di essermi spiegato e grazie a chi risponderà
    Ultima modifica di gutguy2 : 03-09-2016 alle ore 17.23.46

  2. #2
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    ho fatto
    Codice:
    <html>
        <head>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        </head>
        <body>
    
            <hr/>
            <div id="ip"></div>
            <div id="address"></div>
    
            <input type="text" value="" id="loc" />
    
            <script type="text/javascript">
    $.get("http://ipinfo.io", function (response) {
        $("#map").html("<img src='https://maps.googleapis.com/maps/api/staticmap?size=300x300&sensor=false&zoom=10&center=" + response.loc +"'/>"); }, "jsonp");
            </script>
        </body>
    </html>
    ma non visualizza nulla

  3. #3
    mzanella non è connesso AlterGuru
    Data registrazione
    29-12-2015
    Messaggi
    1,954

    Predefinito

    Devi aggiungere contenitore con id="map", in modo che la funzione di callback possa selezionarlo e crearci un'immagine dentro.

    Anziché creare un nuovo elemento HTML in questo modo, però, credo sarebbe meglio definire un'immagine inizialmente vuota ed impostarne l'attributo src tramite jQuery a seguito della richiesta AJAX.

  4. #4
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    e come posso fare a farlo, non ho capito molto bene, purtroppo sono un po' arruginito...

  5. #5
    mzanella non è connesso AlterGuru
    Data registrazione
    29-12-2015
    Messaggi
    1,954

    Predefinito

    Questo è il più piccolo esempio funzionante:
    Codice HTML:
    <html>
        <head>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        </head>
        <body>        
            <img src="" alt="map" id="map" />
    
            <script type="text/javascript">
                $.get("http://ipinfo.io", function (response) {
                    $("#map").attr('src', "https://maps.googleapis.com/maps/api/staticmap?size=300x300&sensor=false&zoom=10&center=" + response.loc);
                }, "jsonp");
            </script>
        </body>
    </html>

  6. #6
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    grazie mille, va benissimo :)
    ma come faccio ad appendere
    Codice:
    "&markers=size:big|color:red|label:H|" + response.loc
    a
    Codice:
    "https://maps.googleapis.com/maps/api/staticmap?size=300x300&sensor=false&zoom=10&center=" + response.loc
    ?
    se faccio
    Codice:
    "https://maps.googleapis.com/maps/api/staticmap?size=300x300&sensor=false&zoom=10&markers=size:big|color:red|label:H|" + response.loc"&center=" + response.loc
    non va
    Ultima modifica di gutguy2 : 04-09-2016 alle ore 22.11.28

  7. #7
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    ho risolto con
    Codice:
    "https://maps.googleapis.com/maps/api/staticmap?&center=&size=500x500&sensor=false&zoom=10&scale=1&format=png&maptype=terrain&markers=size:big|color:red|label:I|" + response.loc
    in pratica uso il dato fornito dal json per alimentare il marker e lasciando center vuoto ottengo lo stesso risultato cmq di avere la mappa centrata

  8. #8
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    ciao,
    ho ora questo codice:
    <html>
    <head>
    <script src="http://gutguy2.altervista.org/jquery/jquery-1.9.1.js"></script>
    <script>window.jQuery ||
    document.write("<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'>\x3C/script>")
    </script>
    </head>
    <body>


    <div id="ip"></div>
    <div id="address"></div>




    <script type="text/javascript">
    $.get("http://ipinfo.io", function (response) {

    $("#address").html(response.country);
    $("#details").html(JSON.stringify(response, null, 4));
    $("#city").html(response.city);
    document.getElementById('city').value = response.city;
    }, "jsonp");
    </script>
    </body>
    </html>
    che mi restituisce il codice iso2 della nazione del visitatore (es. "IT"), mi chiedo come faccio ad utilizzarlo con http://country.io/names.json che contiene un mapping tra i codici nazioni e i loro nomi, queste le prime righe
    Codice:
    {"BD": "Bangladesh", "BE": "Belgium", "BF": "Burkina Faso", "BG": "Bulgaria"}
    in modo tale che per es. invece di "IT" per il visitatore con un isp italiano visualizzi "Italy"?
    Ultima modifica di gutguy2 : 11-09-2016 alle ore 21.39.27 Motivo: mancava il format del JSON

  9. #9
    mzanella non è connesso AlterGuru
    Data registrazione
    29-12-2015
    Messaggi
    1,954

    Predefinito

    Gli oggetti in JavaScript possono essere acceduti allo stesso modo dei vettori:
    Codice:
        var nazioni = {"BD": "Bangladesh", "BE": "Belgium", ...};
        var iso2 = "IT";
        var nome_nazione = nazioni[iso2];

  10. #10
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    Citazione Originalmente inviato da mzanella Visualizza messaggio
    Gli oggetti in JavaScript possono essere acceduti allo stesso modo dei vettori:
    Codice:
        var nazioni = {"BD": "Bangladesh", "BE": "Belgium", ...};
        var iso2 = "IT";
        var nome_nazione = nazioni[iso2];
    cosa intendi, scusami ma non sono afferrato come te, come dovrei riscrivere il codice sopra allora?
    Ti ringrazio per la pazienza...

  11. #11
    mzanella non è connesso AlterGuru
    Data registrazione
    29-12-2015
    Messaggi
    1,954

    Predefinito

    Una volta ottenuto l'iso1, puoi effettuare una nuova richiesta AJAX verso http://country.io/names.json, ottenendo il JSON che associa i codici alle nazioni. Allora potrai leggere la nazione associata al codice e farne ciò che vuoi:
    Codice:
    ...
    var iso2 = ...;
    $.get("http://country.io/names.json"), function (names) {
        var county = names[iso2];
    });

  12. #12
    gutguy2 non è connesso Utente
    Data registrazione
    22-12-2005
    Residenza
    BO
    Messaggi
    168

    Predefinito

    Citazione Originalmente inviato da mzanella Visualizza messaggio
    Una volta ottenuto l'iso1, puoi effettuare una nuova richiesta AJAX verso http://country.io/names.json, ottenendo il JSON che associa i codici alle nazioni.
    rinnovo il ringraziamento anche per la pazienza, ma come faccio ad impostare l'iso1?

  13. #13
    mzanella non è connesso AlterGuru
    Data registrazione
    29-12-2015
    Messaggi
    1,954

    Predefinito

    Più che impostarlo, devi leggerlo e poi utilizzarlo per recuperare il nome esteso. Basta estendere il codice che già avevi:
    Codice:
    $.get("http://ipinfo.io", function (response) {
        $("#address").html(response.country);
        ...
    
        var iso2 = response.iso2; // suppongo che il campo si chiami iso2, controlla che sia effettivamente così!
        $.get("http://country.io/names.json"), function (names) {
            var county = names[iso2];
            $("#country").html(country);  // Userai il nome esteso "country" in qualche modo
        });
    }, "jsonp");
    PS: Non mi è più chiaro se ti serve l'iso1 o l'iso2, in ogni caso il codice è fondamentalmente lo stesso.
    Ultima modifica di mzanella : 27-09-2016 alle ore 12.46.17

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •