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>

asked 05 Oct '14, 09:54

enric73's gravatar image

enric73
1111
accept rate: 0%

edited 05 Oct '14, 23:02

SimonPoole's gravatar image

SimonPoole ♦
37.9k13284602


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

permanent link

answered 15 Oct '14, 14:43

enric73's gravatar image

enric73
1111
accept rate: 0%

Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported

Question tags:

×257
×162
×111
×80

question asked: 05 Oct '14, 09:54

question was seen: 6,271 times

last updated: 15 Oct '14, 14:43

powered by OSQA