Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

Using openlayers and javascript I wish to create two vector layers and add a polygon to one of them and a circle with a centre point to the other

My polygon will be in WKT and my circle will be a point with a radius (Either as a distance or converted into approx DMS First)

I’ve seen this page but I need to it onload as the variables will be passed from an HTML form into a Perl script witch in tern writes the open layers

This is as far as I’ve got

Var box = new OpenLayers.Format.WKT().read("POLYGON((1.3 52.1,1.4 52.1,1.4 52,1.3 52,1.3 52.1))”);

This fails error message is vector.div undefined do i need to create the layer first then add the feature?

Also Can I get the style from GeoServer or do I need to set it here? Haven’t a clue how to create the other layer.

Could some one give me and example of how to do this? By the way my base layer / co-ordinate system is WGS84 and so are the given co-ordinates.

Thanx Holly


If i wished to draw the new vector polygon as a green box with a black border would this work?

var Green_Box ={
    fillColor: "#33CC00",
    strokeColor: "#000000",
    strokeWidth: 1

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

var format = new OpenLayers.Format.WKT({
    'internalProjection': map.baseLayer.projection,
    'externalProjection': new OpenLayers.Projection("EPSG:4326", {
     'style': Green_box,
      'renderers': renderer


note: was playing with this at work came home found the above but now unable to test it until after easter


share|improve this question
up vote 4 down vote accepted

Here's an example of creating two layers like you said, one polygon layer and one circle layer.

Working Example

It first creates the polygon from the coords you provided above and then creates a 3 kilometer radius circle from the centroid of that feature.

enter image description here

Update per comment:

* APIMethod: createGeodesicPolygon
* Create a regular polygon around a radius. Useful for creating circles
* and the like.
* Parameters:
* origin - {<OpenLayers.Geometry.Point>} center of polygon.
* radius - {Float} distance to vertex, in map units.
* sides - {Integer} Number of sides. 20 approximates a circle.
* rotation - {Float} original angle of rotation, in degrees.
* projection - {<OpenLayers.Projection>} the map's projection

Update #2 Per Comment:

So if you'd like to style all the features in the layer the same you could add the style at the layer level:

var vectorLayer = new OpenLayers.Layer.Vector("myPolygonLayer", {
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style({
            fillColor: "#33CC00",
            strokeColor: "#000000",
            strokeWidth: 1

Or you can style it at the individual feature level:

var style_Green_Box = OpenLayers.Util.extend({},['default']);
style_Green_Box.strokeColor = "#000000";
style_Green_Box.fillColor = "#33CC00";
style_Green_Box.strokeWidth = 1; = style_Green_Box;

Here's the DEMO Update which shows this.

enter image description here

share|improve this answer
Wow thanks very much. Q if in future i need to create the circle from a lat long and a distance would that be like this var origin = "new OpenLayers.Geometry.Point(Lat Long)"; then set the radius here var polygon = createGeodesicPolygon(origin, RADIUS, 60, 0, map.getProjectionObject()); what are the other values 60, 0 ? – Holly Apr 4 '12 at 18:53
Yes that's correct var origin = ... how you have it. check my update, but 60, is the amout of sides in the circles. or basically lines in the linesstring that make up the circle. and 0 is the rotation, which doesn't make sense to me because if you rotate a circle it still looks the same. – CaptDragon Apr 4 '12 at 19:07
CaptDragon Played with this at work & it worked a treat Wasn't able to add a style though Added some code to origenal question plese look Thanx – Holly Apr 5 '12 at 13:31
Sure take a look at my new update. – CaptDragon Apr 5 '12 at 13:58
Thanx now it makes sense FYI for the project I'm currently grappling with the vector layer will only have one feature either a polygon or a circle so in this instance it wouldn't matter if the style is set at the layer level but it's good to know how to set at the feature level as well. Thanx again Holly – Holly Apr 5 '12 at 15:02

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.