AW: [OpenLayers-Users] Circle around clicked point
Arnd Wippermann
arnd.wippermann at web.de
Thu May 10 10:13:23 PDT 2012
First argument of createRegularPolygon is the origin like
var origin = {x:lonlat.lon, y:lonlat.lat};
var circleout = new OpenLayers.Geometry.Polygon.createRegularPolygon(origin,
0.0096, 50);
Arnd
-----Ursprüngliche Nachricht-----
Von: openlayers-users-bounces at lists.osgeo.org
[mailto:openlayers-users-bounces at lists.osgeo.org] Im Auftrag von Alberto
Najera
Gesendet: Donnerstag, 10. Mai 2012 18:09
An: openlayers-users at lists.osgeo.org
Betreff: [OpenLayers-Users] Circle around clicked point
Hello
I need to draw a circle around a click selected point on the map. Looking at
samples in this forum, some web search as well as the OpenLayers page, I
have put the following code together, but the circle is not drawn. The map
is in EPSG 4326 so units are decimal degrees.
I added a vector layer where the circle shall be drawn:
var vector_layer = new OpenLayers.Layer.Vector("Zona Influencia")
//Add layers to the map
map.addLayers([layer1, layer2, vector_layer]);
//Register the click event to get the clicked point coordinates
map.events.register('click', map, Circulo);
var map_center = new OpenLayers.LonLat(-99.24801,19.49775);
if(!map.getCenter()){
map.setCenter(map_center);
}
}
// Function to draw the circle around the clicked point
function Circulo(evt)
{
var lonlat = map.getLonLatFromViewPortPx(evt.xy);
// use lonlat
var circleout = new
OpenLayers.Geometry.Polygon.createRegularPolygon(lonlat, 0.0096, 50);
vector_layer.addFeatures(new OpenLayers.Feature.Vector(circleout));
}
What am I missing?
Full page code is as follows:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<title>Open Layers Test</title>
<script type='text/javascript'
src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type='text/javascript'>
var map;
function init() {
// Setup our map object
map = new OpenLayers.Map('map_element', {
controls: [
new OpenLayers.Control.Navigation(),
new OpenLayers.Control.PanZoomBar(),
new OpenLayers.Control.LayerSwitcher(),
new OpenLayers.Control.ScaleLine()
],
maxExtent: new OpenLayers.Bounds (-99.269569,19.479910,
-99.224060, 19.524080),
maxScale: 15000,
minScale: 2500
});
// Setup our layer objects
var layer1 = new OpenLayers.Layer.WMS(
"Parques",
"http://myhost/cgi-bin/mapserv?",
{map: '/home/bicimapas/mapdata/BiciMapasMS.map',
layers:'parque'});
var layer2 = new OpenLayers.Layer.WMS(
"Caminos",
"http://myhost/cgi-bin/mapserv?",
{map: '/home/bicimapas/mapdata/BiciMapasMS.map',
layers:'caminos', transparent: true}, {isBaseLayer:false});
// Vector layer to draw the circle
var vector_layer = new OpenLayers.Layer.Vector("Zona Influencia")
//Add layers to the map
map.addLayers([layer1, layer2, vector_layer]);
//Register the click event to get the clicked point coordinates
map.events.register('click', map, Circulo);
var map_center = new OpenLayers.LonLat(-99.24801,19.49775);
if(!map.getCenter()){
map.setCenter(map_center);
}
}
// Function to draw the circle around the clicked point
function Circulo(evt)
{
var lonlat = map.getLonLatFromViewPortPx(evt.xy);
// use lonlat
var circleout = new
OpenLayers.Geometry.Polygon.createRegularPolygon(lonlat, 0.0096, 50);
vector_layer.addFeatures(new OpenLayers.Feature.Vector(circleout));
}
</script>
</head>
<body onload='init();'> mapa de prueba
<div id='map_element' style='width: 700px; height: 500px; border: 1px
solid black'>
</div>
</body>
</html>
Thanks in advance for your help
Alberto Najera
_______________________________________________
Users mailing list
Users at lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-users
More information about the Users
mailing list