Añadir" Área de búsqueda " esquema en el resultado de Google maps


El año pasado, Google agregó perfiles de área de búsqueda a sus ofertas como se informó en muchos lugares, y visible en Google maps. Por ejemplo aquí, e informó aquí y aquí.

Para ser explícito, esto es cuando Google agrega un esquema relacionado con la consulta de búsqueda. Si busca una ciudad, un código postal o un código postal, Google resaltará esta región del mapa. Ejemplo:

90210 Buscar en Google Maps

Esto aparentemente no estaba disponible a través de la API, y solo a través de las propias propiedades web de Google.

Recientemente, noté algunos otros dominios usando esta funcionalidad, por ejemplo en Twitter.

¿Hay una API separada que Twitter y otras grandes organizaciones estén utilizando? ¿Se ha añadido esta funcionalidad, pero aún no está documentada? ¿O simplemente me he perdido el anuncio y no puedo encontrar ningún documento?

Author: dazbradbury, 2012-03-14

4 answers

Los contornos que ves allí provienen de twitter, deben haberlos almacenado.

Eche un vistazo al archivo json que se solicita cuando llama a la página de twitter: http://api.twitter.com/1/geo/id/c3f37afa9efcf94b.json

Lo he probado, geometry.coordinates[0][0] define un polígono fino(adivina el contorno de Austin).

Cuando lo intentes, observa que el orden del par es lng,lat no lat,lng

Así que la twitter-geo-API puede ser un buen comienzo para implementar los esquemas, afortunadamente, Twitter es compatible con JSONP para una solución de cliente.

Ver un ejemplo: http://jsfiddle.net/doktormolle/MRYm3/

<edit>

Se ha cambiado la twitter-API, el ejemplo ya no funciona (se requiere autenticación)

</edit>

 17
Author: Dr.Molle,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-11-02 12:31:37

Como aún no hay una solución ofrecida por la API de Mapas y rellenar manualmente las coordenadas no es asunto de nadie, aquí hay una joya de alternativa. Encontré esta respuesta en el sitio web de GIS absolute absolute lifesaver (le habría ahorrado a jurihandl muchos minutos dibujando Calgary, arriba; D):

Puede obtener coordenadas de polígonos en json para usar con googlemaps usando openstreetmap. Ir a http://nominatim.openstreetmap.org / . Buscar un lugar como"San Francisco, CA"

Haga clic en"Detalles"

Busque OSM ID y cópielo (control + c), ejemplo: 2018776

Pega el ID http://polygons.openstreetmap.fr/index.py y descargar el archivo JSON

Fuente: SIG

 22
Author: Govind Rai,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-04-13 12:33:44

Encontré una solución bastante buena para dibujar la frontera de la ciudad.

Aquí hay una herramienta bastante genial, donde puedes dibujar la frontera de la ciudad. Puedes ser tan exacto como quieras ser: http://www.birdtheme.org/useful/v3tool.html

En el lado derecho se obtiene una vista previa en vivo de su código. Puede elegir entre KML y javascript. Cambia a javascript. Entonces copie sus coordenadas.

Aquí está el sitio completo donde se puede ver la frontera de Bruselas (Europa).

<!DOCTYPE html>
<html lang="en-US">
 <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>::Maps ::</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&key=AIzaSyD0X4v7eqMFcWCR-VZAJwEMfb47id9IZao"></script>
    <script type="text/javascript">
        var map;

        //COORDS
        var brussels = [
        new google.maps.LatLng(50.835866,4.258575),
        new google.maps.LatLng(50.818083,4.244499),
        new google.maps.LatLng(50.811358,4.276428),
        new google.maps.LatLng(50.813094,4.302177),
        new google.maps.LatLng(50.773162,4.338226),
        new google.maps.LatLng(50.764259,4.384918),
        new google.maps.LatLng(50.793132,4.482422),
        new google.maps.LatLng(50.810274,4.450836),
        new google.maps.LatLng(50.821120,4.476585),
        new google.maps.LatLng(50.852342,4.462852),
        new google.maps.LatLng(50.866861,4.421310),
        new google.maps.LatLng(50.895021,4.430580),
        new google.maps.LatLng(50.911692,4.413757),
        new google.maps.LatLng(50.912342,4.395561),
        new google.maps.LatLng(50.898486,4.377708),
        new google.maps.LatLng(50.900868,4.328957),
        new google.maps.LatLng(50.889174,4.293251),
        new google.maps.LatLng(50.880294,4.297028),
        new google.maps.LatLng(50.861878,4.279175),
        new google.maps.LatLng(50.855593,4.288788),
        new google.maps.LatLng(50.837817,4.282608),
        new google.maps.LatLng(50.835866,4.259605)
        ];

        $(document).ready(function () {
            //WHERE TO CENTER YOUR MAP
            var latlng = new google.maps.LatLng(50.834999,4.387665);
            var myOptions = {
                zoom: 10,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

            var BrusselsHightlight;

            //DRAW THE POLYGON OR POLYLINE
            BrusselsHightlight = new google.maps.Polygon({
                paths: brussels,
                strokeColor: "#6666FF",
                strokeOpacity: 0.8,
                strokeWeight: 2,
                fillColor: "#6666FF",
                fillOpacity: 0.35
            });
            BrusselsHightlight.setMap(map);

        });

    </script>
    <style type="text/css">
        html,body { height: 100%; margin: 0px; padding: 0px; }
        #map_canvas {
            width:600px;
            height:400px;
        }       
    </style>
</head>
<body >
<div id="map_canvas">

</div>
<!--main-->
<div id="map_cord"></div>
</body> 
</html>

Esto funcionó muy bien para mí.

 8
Author: jurihandl,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-06-05 12:22:57

Twitter api geo endpoint NO le dará el límite de la ciudad,

Lo que te proporcionan es SOLO un cuadro delimitador con 5 puntos (lat, long)

Esto es lo que obtengo de twitter api geo para San Francisco introduzca la descripción de la imagen aquí

 0
Author: hoogw,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-03-29 18:33:33