Hi All,<br> This is the first time i am learning about OpenLayers. I am doing a small example project to get familiar with OpenLayers. I read a kml file (containing various locations) into the OpenLayers. the next task is to search the map based on the location so that it displays only the placemarks in that location. Can anyone help me in writng the code for it.<br>
<br>So far i developed the following using various openlayer examples<br><br><a href="mailto:openlayers-users@lists.osgeo.org"><span class="il"></span></a>html><br> <head><br> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"><br>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"><br> <meta name="apple-mobile-web-app-capable" content="yes"><br>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css"><br> <link rel="stylesheet" href="style.css" type="text/css"><br>
<div><br> <style type="text/css"><br> html, body {<br> height: 100%;<br> }<br> #map {<br> width: 100%;<br> height: 75%;<br> border: 1px solid black;<br>
}<br> .olPopup p { margin:0px; font-size: .9em;}<br> .olPopup h2 { font-size:1.2em; }<br> </style><br> <script src="<a href="http://openlayers.org/api/OpenLayers.js">http://openlayers.org/api/OpenLayers.js</a>"></script><br>
<script type="text/javascript"><br> var lon = 5;<br> var lat = 40;<br> var zoom = 3;<br> var map, select;<br> function setCumulative() {<br> var nav = map.getControlsByClass("OpenLayers.Control.Navigation")[0];<br>
var cumulative = document.getElementById("cumulative");<br> nav.handlers.wheel.cumulative = cumulative.checked;<br> }<br> function init(){<br> map = new OpenLayers.Map('map', {<br>
controls: [<br> new OpenLayers.Control.Navigation(<br> {mouseWheelOptions: {interval: 100}}<br> ),<br> new OpenLayers.Control.ScaleLine(),<br>
new OpenLayers.Control.KeyboardDefaults(),<br> new OpenLayers.Control.PanZoom(),<br> new OpenLayers.Control.ArgParser(),<br> new OpenLayers.Control.Attribution()<br>
]} );<br> <br> var bounds = new OpenLayers.Bounds(-70,-70, 40, 80); <br> var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",<br> "<a href="http://vmap0.tiles.osgeo.org/wms/vmap0">http://vmap0.tiles.osgeo.org/wms/vmap0</a>", {layers:'basic'} );<br>
<br> var thesis = new OpenLayers.Layer.Vector("KML", {<br> strategies: [new OpenLayers.Strategy.Fixed()],<br> protocol: new OpenLayers.Protocol.HTTP({<br> url: "georeferences_test3.kml",<br>
format: new OpenLayers.Format.KML({<br> extractStyles: true, <br> extractAttributes: true,<br> maxDepth: 1<br> })<br> })<br>
});<br> <br> map.addLayers([wms, thesis]);<br> map.zoomToMaxExtent();<br> select = new OpenLayers.Control.SelectFeature(thesis);<br> thesis.events.on({<br> "featureselected": onFeatureSelect,<br>
"featureunselected": onFeatureUnselect<br> });<br><br> map.addControl(select);<br> select.activate(); <br> map.zoomToExtent(bounds);<br> <br> }<br>
function onPopupClose(evt) {<br> select.unselectAll();<br> }<br> function onFeatureSelect(event) {<br> var feature = event.feature;<br> // Since KML is user-generated, do naive protection against<br>
// Javascript.<br> var content = "<h4>"+<a href="http://feature.attributes.name">feature.attributes.name</a> + "</h4>" + feature.attributes.description;<br> if (content.search("<script") != -1) {<br>
content = "Content contained Javascript! Escaped content below.<br>" + content.replace(/</g, "<");<br> }<br> popup = new OpenLayers.Popup.FramedCloud("chicken", <br>
feature.geometry.getBounds().getCenterLonLat(),<br> new OpenLayers.Size(5,10),<br> content,<br> null, true, onPopupClose);<br>
feature.popup = popup;<br> map.addPopup(popup);<br> }<br> function onFeatureUnselect(event) {<br> var feature = event.feature;<br> if(feature.popup) {<br> map.removePopup(feature.popup);<br>
feature.popup.destroy();<br> delete feature.popup;<br> }<br> }<br> </script><br> </head><br clear="all"><br>-- <br>Naga Raghuveer Modala<br><br><br>