city search in openlayers, openstreetmap

Question

I am new with Openlayers and OpenStreetMap. I need to insert in the map a search city. In order to write the name of city, click on button, and get the position of the city in the map. Could anybody help me? I show the code I use, well in the linia var jsonurl = "/data/2.1/find/name?q="+param; I really don't have the script name,...it fails here, .... thank you in advanced...

<html>
<head><title>OpenLayers</title></head>
<body>
<div id="mapdiv">
<form id="searchform" action="#" method="get" style="display:inline" 
onsubmit="FindCity(); return false">
<input type="text" id="query_str" name="query_str" value="London, UK" 
onfocus="this.value = (this.value=='London, UK')? '' : this.value;">
<input type="submit" value=" Find ">
</form>
</div>
  <link rel="stylesheet" href="/OpenLayers-2.13.1/theme/default/google.css" type="text/css">
 <script src="http://maps.google.com/maps/api/js?v=3.3&sensor=false"></script>
 <script type="text/javascript" src="/OpenLayers-2.13.1/OpenLayers.js"> </script>
  <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
  <script>




    map = new OpenLayers.Map("mapdiv");
    map.addLayer(new OpenLayers.Layer.OSM());

    var pois = new OpenLayers.Layer.Text( "My Points",
                    { location:"data1.txt",
                      projection: map.displayProjection
                    });
    map.addLayer(pois);


    //Set start centrepoint and zoom
    //TODO: Is it possible to just zoom to extents of defined markers instead?

    var lonLat = new OpenLayers.LonLat( 1.00, 41.00 )
          .transform(
            new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
            map.getProjectionObject() // to Spherical Mercator Projection
          );
    var zoom=7;
    map.setCenter (lonLat, zoom);

   function getSearchData(JSONtext)
{
    console.log( JSONtext  );
    JSONobject = ParseJson(JSONtext);

    city = JSONobject.list;
    if( city.length == 0 ) {
        ShowAlertMess( 'not found' );
        return;
    }

    var centre = new OpenLayers.LonLat(city[0].coord.lon, city[0].coord.lat);
    centre.transform(
            new OpenLayers.Projection("EPSG:4326"),
            new OpenLayers.Projection("EPSG:900913")
    );
    map.setCenter( centre, 10);

//  alert(JSONobject.cod);
}

function FindCity()
{
    param = document.getElementById('query_str').value;

    var jsonurl = "/data/2.1/find/name?q="+param;
    $.get(jsonurl, getSearchData).error(errorHandler);
    return false;   
}

</script>
</body>
</html>

Answer 1

There is an example here of geocoding , http://dev.openlayers.org/examples/openls.html, thank you everybody

city search in openlayers, openstreetmap

Related questions