diff --git a/examples/geolocation.html b/examples/geolocation.html index 24d426b751..5fd41c7614 100644 --- a/examples/geolocation.html +++ b/examples/geolocation.html @@ -13,7 +13,7 @@ } - +

Geolocation Example

diff --git a/examples/geolocation.js b/examples/geolocation.js index 259232ed47..dc847ced33 100644 --- a/examples/geolocation.js +++ b/examples/geolocation.js @@ -1,8 +1,7 @@ var style = { - fillOpacity: 0.1, fillColor: '#000', - strokeColor: '#f00', - strokeOpacity: 0.6 + fillOpacity: 0.1, + strokeWidth: 0 } var map = new OpenLayers.Map('map'); @@ -17,6 +16,34 @@ map.setCenter( ), 12 ); +var pulsate = function(feature) { + var point = feature.geometry.getCentroid(), + bounds = feature.geometry.getBounds(), + radius = Math.abs((bounds.right - bounds.left)/2), + count = 0, + grow = 'up'; + + var resize = function(){ + if (count>16) clearInterval(window.resizeInterval); + var interval = radius * 0.03; + var ratio = interval/radius; + switch(count) { + case 4: + case 12: + grow = 'down'; break; + case 8: + grow = 'up'; break; + } + if (grow!=='up') { + ratio = - Math.abs(ratio); + } + feature.geometry.resize(1+ratio, point); + vector.drawFeature(feature); + count++; + } + window.resizeInterval = window.setInterval(resize, 50, point, radius); +}; + var geolocate = new OpenLayers.Control.Geolocate({ geolocationOptions: { enableHighAccuracy: false, @@ -27,6 +54,16 @@ var geolocate = new OpenLayers.Control.Geolocate({ map.addControl(geolocate); geolocate.events.register("locationupdated",this,function(e) { vector.removeAllFeatures(); + var circle = new OpenLayers.Feature.Vector( + OpenLayers.Geometry.Polygon.createRegularPolygon( + new OpenLayers.Geometry.Point(e.point.x, e.point.y), + e.position.coords.accuracy/2, + 40, + 0 + ), + {}, + style + ); vector.addFeatures([ new OpenLayers.Feature.Vector( e.point, @@ -39,34 +76,28 @@ geolocate.events.register("locationupdated",this,function(e) { pointRadius: 10 } ), - new OpenLayers.Feature.Vector( - OpenLayers.Geometry.Polygon.createRegularPolygon( - new OpenLayers.Geometry.Point(e.point.x, e.point.y), - e.position.coords.accuracy/2, - 50, - 0 - ), - {}, - style - ) + circle ]); map.zoomToExtent(vector.getDataExtent()); + pulsate(circle); }); geolocate.events.register("locationfailed",this,function() { OpenLayers.Console.log('Location detection failed'); }); $('locate').onclick = function() { + vector.removeAllFeatures(); geolocate.deactivate(); $('track').checked = false; geolocate.watch = false; geolocate.activate(); }; $('track').onclick = function() { + vector.removeAllFeatures(); geolocate.deactivate(); if (this.checked) { geolocate.watch = true; geolocate.activate(); } }; -$('track').checked = false; \ No newline at end of file +$('track').checked = false;