[OpenLayers-Users] Openlayers circle Polygon on OpenStreetMaps layer

Fabrizio Buratta extremoburo at gmail.com
Thu Mar 15 12:22:59 EDT 2012


I'm trying to create a circle with a defined center and put an icon
marker on it. The code is working if I use images instead of
OpenLayers.Geometry.Polygon.createRegularPolygon. I wasn't able to
solve it.

here you find my code:

<html>
<head>
<title>OpenLayers Example</title>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
</head>
<body>

<div id="mapdiv"></div>
<script>

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

epsg4326 =  new OpenLayers.Projection("EPSG:4326"); //WGS 1984 projection
projectTo = map.getProjectionObject(); //The map projection (Spherical Mercator)

var lonLat = new OpenLayers.LonLat( -0.1279688 ,51.5077286
).transform(epsg4326,     projectTo);

var zoom=6;
map.setCenter (lonLat, zoom);

var mycircle = OpenLayers.Geometry.Polygon.createRegularPolygon(
               new OpenLayers.Geometry.Point( lonLat ),
               1,
               30
           );

var featurecircle = new OpenLayers.Feature.Vector(mycircle);


var vectorLayer = new OpenLayers.Layer.Vector("Overlay");

// Define markers as "features" of the vector layer:
vectorLayer.addFeatures(featurecircle);

var feature = new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point( -0.1244324, 51.5006728
).transform(epsg4326, projectTo),
        {description:'info'} ,
        {externalGraphic: 'img/marker.png', graphicHeight: 25,
graphicWidth: 21,      graphicXOffset:-12, graphicYOffset:-25  }
    );
vectorLayer.addFeatures(feature);


map.addLayer(vectorLayer);


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

Thanks in advance for any tips.

-- 
Fab

http://twitter.com/extremoburo

http://www.linkedin.com/in/fburatta

http://www.nonfateviprenderedalpanico.it


More information about the Users mailing list