<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<META NAME="Generator" CONTENT="MS Exchange Server version 6.5.7654.12">
<TITLE>Re: [OpenLayers-Users] Markers with dymamically changing appearance</TITLE>
</HEAD>
<BODY>
<!-- Converted from text/plain format -->
<P><FONT SIZE=2>Regarding the first question:<BR>
<BR>
i did something like this in order to create a rectangle of a given<BR>
pixel size centered on a coordinate on the map (to make a print tool)..<BR>
the relevant code parts are:<BR>
<BR>
first i set up some choices for paper sizes<BR>
<BR>
//the available paper sizes<BR>
papers: {<BR>
"a4_landscape":{<BR>
<BR>
width: 3507,<BR>
height: 2481,<BR>
box: "landscape"<BR>
},<BR>
"a4_portrait": {<BR>
name: "A4 St\345ende",<BR>
width: 2481,<BR>
height: 3507,<BR>
box: "portrait",<BR>
selected: true<BR>
},<BR>
"a3_landscape":{<BR>
name: "A3 Liggende",<BR>
width: 4962,<BR>
height: 3507,<BR>
box: "landscape"<BR>
},<BR>
"a3_portrait": {<BR>
name: "A3 St\345ende",<BR>
width: 3507,<BR>
height: 4962,<BR>
box: "portrait"<BR>
}<BR>
},<BR>
<BR>
sizes: {<BR>
"portrait": {<BR>
width: 496,<BR>
height: 700<BR>
},<BR>
"landscape": {<BR>
width: 700,<BR>
height: 496<BR>
}<BR>
},<BR>
<BR>
then i start off with setting the paper, which finds the width and<BR>
height based on the given paper (this could probably be simplified a<BR>
lot, not finished yet), finds the map center and gets the pixel value<BR>
for that, and then either creates or moves the polygon<BR>
<BR>
setPaper: function(paper) {<BR>
this.paper = paper;<BR>
<BR>
//get the boxSize<BR>
this.boxSize = {};<BR>
this.boxSize.width = this.sizes[this.papers[this.paper].box].width;<BR>
this.boxSize.height =<BR>
this.sizes[this.papers[this.paper].box].height;<BR>
<BR>
//find the center pixel for the box<BR>
var centerPx = this.map.getPixelFromLonLat(this.map.getCenter());<BR>
<BR>
//create or move the polygon to the center of the map<BR>
if (!this.feature) {<BR>
this.addPolygon(this.paper, centerPx);<BR>
}<BR>
else {<BR>
this.lastCenter = this.feature.geometry.getCentroid();<BR>
this.addPolygon(this.paper, centerPx);<BR>
this.movePolygon();<BR>
}<BR>
},<BR>
<BR>
//add the print area polygon<BR>
addPolygon: function(paper, centerPx) {<BR>
//remove previous feature<BR>
this.mylayer.destroyFeatures();<BR>
<BR>
//calculate the extent of the box<BR>
var addX = this.boxSize.width / 2;<BR>
var addY = this.boxSize.height / 2;<BR>
<BR>
var center = this.map.getLonLatFromPixel(new<BR>
OpenLayers.Pixel(centerPx.x,centerPx.y));<BR>
var leftBottom = this.map.getLonLatFromPixel(new<BR>
OpenLayers.Pixel(centerPx.x-addX, centerPx.y+addY));<BR>
var rightTop = this.map.getLonLatFromPixel(new<BR>
OpenLayers.Pixel(centerPx.x+addX, centerPx.y-addY));<BR>
<BR>
//create the polygon, the feature and add to the layer<BR>
var poly = new OpenLayers.Geometry.Polygon(<BR>
new OpenLayers.Geometry.LinearRing([<BR>
new OpenLayers.Geometry.Point(leftBottom.lon,<BR>
leftBottom.lat),<BR>
new OpenLayers.Geometry.Point(leftBottom.lon,<BR>
rightTop.lat),<BR>
new OpenLayers.Geometry.Point(rightTop.lon,<BR>
rightTop.lat),<BR>
new OpenLayers.Geometry.Point(rightTop.lon,<BR>
leftBottom.lat)<BR>
])<BR>
);<BR>
this.feature = new OpenLayers.Feature.Vector(poly);<BR>
this.mylayer.addFeatures([this.feature]);<BR>
},<BR>
<BR>
movePolygon: function() {<BR>
var pixel = this.map.getPixelFromLonLat(new<BR>
OpenLayers.LonLat(this.lastCenter.x, this.lastCenter.y));<BR>
var lastPixel = this.map.getPixelFromLonLat(this.map.getCenter());<BR>
<BR>
var res = this.map.getResolution();<BR>
<BR>
this.feature.geometry.move(res * (pixel.x - lastPixel.x),<BR>
res * (lastPixel.y - pixel.y));<BR>
this.mylayer.drawFeature(this.feature);<BR>
},<BR>
<BR>
and then a listener for zoomend this.map.events.register("zoomend",<BR>
this, this.scaleChanged);<BR>
<BR>
which calls:<BR>
<BR>
//scale of map changed<BR>
scaleChanged: function() {<BR>
var centerPx = this.map.getPixelFromLonLat(this.map.getCenter());<BR>
this.addPolygon(this.paper, centerPx);<BR>
},<BR>
<BR>
to redraw the polygon<BR>
<BR>
<BR>
hope this helps somewhat<BR>
<BR>
-atle<BR>
<BR>
On 08/11/2010 10:00 AM, Bart van den Eijnden (OSGIS) wrote:<BR>
> Hi,<BR>
><BR>
> please always cc the list, since I don't know all the answers and people<BR>
> with similar issues can find it in the e-mail archives later on.<BR>
><BR>
> Your first question: I don't know.<BR>
><BR>
> Redrawing can be done using:<BR>
><BR>
> feature.layer.drawFeature(feature);<BR>
><BR>
> <A HREF="http://dev.openlayers.org/docs/files/OpenLayers/Layer/Vector-js.html#OpenLayers.Layer.Vector.drawFeature">http://dev.openlayers.org/docs/files/OpenLayers/Layer/Vector-js.html#OpenLayers.Layer.Vector.drawFeature</A><BR>
><BR>
> Best regards,<BR>
> Bart<BR>
><BR>
> <BR>
>> On Aug 11, 2010, at 0:16 , Bart van den Eijnden (OSGIS) wrote:<BR>
>><BR>
>> <BR>
>>> please check out:<BR>
>>><BR>
>>> <A HREF="http://docs.openlayers.org/library/feature_styling.html">http://docs.openlayers.org/library/feature_styling.html</A><BR>
>>><BR>
>>> Labels can be drawn as well with vector features, see e.g.:<BR>
>>><BR>
>>> <A HREF="http://openlayers.org/dev/examples/vector-features-with-text.html">http://openlayers.org/dev/examples/vector-features-with-text.html</A><BR>
>>> <BR>
>> Thanks.<BR>
>><BR>
>> Two more questions:<BR>
>><BR>
>> - how do I draw in screen coordinates (I need to draw a polygon starting<BR>
>> from a latlong, then draw 2em up and to the right etc), and have it stay<BR>
>> the same size on-screen when the user zooms (ie make markers)?<BR>
>> - how do I redraw these things? Just erase them and draw new ones, or do I<BR>
>> replace their graphics properties?<BR>
>> <BR>
><BR>
> <BR>
<BR>
<BR>
--<BR>
Atle Frenvik Sveen<BR>
Utvikler<BR>
Geomatikk IKT AS<BR>
tlf: 45 27 86 89<BR>
atle.frenvik.sveen@geomatikk.no<BR>
<BR>
</FONT>
</P>
</BODY>
</HTML>