<div dir="ltr">Hello,<div><br></div><div>I am beginner for openlayers. I wanted to draw rectangle as a marker with openlayers vector feature.</div><div>But when I zoom in or out, rectangle changes its size. I have shared following piece of code.</div>
<div><br></div><div><div>var box_extents1 = [[500, 00, 00, -600], [540, 00, 00, -500]]</div></div><div><div>var style = new OpenLayers.StyleMap({</div><div> 'default':OpenLayers.Util.applyDefaults({</div><div>
<span class="" style="white-space:pre"> </span> pointRadius: "${r}",</div><div> <span class="" style="white-space:pre"> </span>label: "${l}",</div><div> <span class="" style="white-space:pre"> </span>allOverlays: true,</div>
<div><span class="" style="white-space:pre"> </span> fillColor: "#008888",</div><div><span class="" style="white-space:pre"> </span> strokeColor: "#000000",</div><div><span class="" style="white-space:pre"> </span> strokeWidth: 0.5,</div>
<div><span class="" style="white-space:pre"> </span> fontSize: "12px", </div><div><span class="" style="white-space:pre"> </span> color: '#ffffff',</div><div><span class="" style="white-space:pre"> </span> width:"20px",</div>
<div><span class="" style="white-space:pre"> </span> height: 20</div><div><span class="" style="white-space:pre"> </span> <span class="" style="white-space:pre"> </span>}, OpenLayers.Feature.Vector.style["default"]</div>
<div><span class="" style="white-space:pre"> </span> ),</div><div><span class="" style="white-space:pre"> </span> 'select':OpenLayers.Util.applyDefaults(</div><div><span class="" style="white-space:pre"> </span> <span class="" style="white-space:pre"> </span>{pointRadius: "${r}"},</div>
<div><span class="" style="white-space:pre"> </span> <span class="" style="white-space:pre"> </span>OpenLayers.Feature.Vector.style.select</div><div><span class="" style="white-space:pre"> </span> )</div><div> });</div>
</div><div><br></div><div><div>var boxes = new OpenLayers.Layer.Vector( "Box Markers" ,{</div><div> styleMap: style</div><div> });</div></div><div><br></div><div><div>for (var i = 0; i < box_extents.length; i++) {</div>
<div> ext = box_extents[i];</div><div> bounds = OpenLayers.Bounds.fromArray(ext);</div></div><div> box = new OpenLayers.Feature.Vector(bounds.toGeometry(), {l:1,r:10});<br></div><div> boxes.addFeatures(box); </div>
<div>}</div><div><br></div><div><br></div><div>map.addLayer(boxes);<br></div><div><br></div><div><br></div><div>Any help is appreciated.</div><div>Thank you </div><div><br></div></div>