Changeset 4268

Timestamp:

09/13/07 16:36:36 (1 year ago)

Author:

elemoine

Message:

allow user to specify offsets for externalGraphic (closes #893)

Files:

• trunk/openlayers/examples/vector-features.html (modified) (1 diff)
• trunk/openlayers/lib/OpenLayers/Feature/Vector.js (modified) (1 diff)
• trunk/openlayers/lib/OpenLayers/Renderer/SVG.js (modified) (2 diffs)
• trunk/openlayers/lib/OpenLayers/Renderer/VML.js (modified) (1 diff)
• trunk/openlayers/tests/Layer/test_Vector.html (modified) (5 diffs)

trunk/openlayers/examples/vector-features.html

@@ -59 +59 @@
-            style_mark.graphicWidth = 24;
-            style_mark.graphicHeight = 20;
+            style_mark.graphicXOffset = -(style_mark.graphicWidth/2);  // this is the default value
+            style_mark.graphicYOffset = -style_mark.graphicHeight;
-            style_mark.externalGraphic = "../img/marker.png";
-            

trunk/openlayers/lib/OpenLayers/Feature/Vector.js

@@ -264 +264 @@
- *  - graphicHeight,
- *  - graphicOpacity
+ *  - graphicXOffset
+ *  - graphicYOffset
- */ 
-OpenLayers.Feature.Vector.style = {

trunk/openlayers/lib/OpenLayers/Renderer/SVG.js

@@ -185 +185 @@
-                // remove old node
-                var id = node.getAttributeNS(null, "id");
-node.getAttributeNS(null, "cx"
-node.getAttributeNS(null, "cy"
+parseFloat(node.getAttributeNS(null, "cx")
+parseFloat(node.getAttributeNS(null, "cy")
-                var _featureId = node._featureId;
-                var _geometryClass = node._geometryClass;
@@ -207 +207 @@
-                width = width ? width : style.pointRadius*2;
-                height = height ? height : style.pointRadius*2;
+                var xOffset = (style.graphicXOffset != undefined) ?
+                    style.graphicXOffset : -(0.5 * width);
+                var yOffset = (style.graphicYOffset != undefined) ?
+                    style.graphicYOffset : -(0.5 * height);
-                var opacity = style.graphicOpacity || style.fillOpacity;
-                
-x-(.5*width
--y-(.5*heigh
+(x + xOffset
+(-y + yOffse
-                node.setAttributeNS(null, "width", width);
-                node.setAttributeNS(null, "height", height);

trunk/openlayers/lib/OpenLayers/Renderer/VML.js

@@ -182 +182 @@
-                width = width ? width : style.pointRadius*2;
-                height = height ? height : style.pointRadius*2;
+
-                var resolution = this.getResolution();
-
-
+
+
+
+
+
+
+
-                node.style.width = width;
-                node.style.height = height;    

trunk/openlayers/tests/Layer/test_Vector.html

@@ -159 +159 @@
-
-    function test_Layer_Vector_externalGraphic(t) {
-9
+11
-        // base layer is needed for getResolution() to return a value,
-        // otherwise VML test will fail because style.left and style.top
@@ -170 +170 @@
-            
-        var layer = new OpenLayers.Layer.Vector("Test Layer");
+        var renderer = layer.renderer;
-        var map = new OpenLayers.Map('map');
-        map.addLayers([baseLayer, layer]);
-
-
+
+
+
-        var feature = new OpenLayers.Feature.Vector(geometry);
+
+        map.zoomToMaxExtent();
-
-        var customStyle1 = new Object({
@@ -198 +203 @@
-                graphicOpacity: 1
-        });
+        var customStyle6 = new Object({
+                externalGraphic: 'test.png',
+                graphicWidth: 24,
+                graphicHeight: 16,
+                graphicXOffset: -24,
+                graphicYOffset: -16
+        });
-               
-layer.
+
-        if (layer.renderer.CLASS_NAME == 'OpenLayers.Renderer.SVG') {
-                feature.style = customStyle1;
@@ -238 +250 @@
-                            'opacity: '+customStyle5.graphicOpacity.toString()+';',
-                            "graphicOpacity correctly set");
+                feature.style = customStyle6;
+                layer.drawFeature(feature);
+                var x = geometryX / renderer.getResolution() + renderer.left;
+                var y = geometryY / renderer.getResolution() - renderer.top;
+                // SVG setStyle() gets x and y using getAttributeNS(), which returns
+                // a value with only 3 decimal digits. To mimic this we use toFixed(3) here
+                x = x.toFixed(3);
+                y = y.toFixed(3);
+                // toFixed() returns a string
+                x = parseFloat(x);
+                y = parseFloat(y);
+                t.eq(root.firstChild.getAttributeNS(null, 'x'),
+                        (x + customStyle6.graphicXOffset).toFixed().toString(),
+                        "graphicXOffset correctly set");
+                t.eq(root.firstChild.getAttributeNS(null, 'y'),
+                        (-y + customStyle6.graphicYOffset).toFixed().toString(),
+                        "graphicYOffset correctly set");
-        }
-        if (layer.renderer.CLASS_NAME == 'OpenLayers.Renderer.VML') {
@@ -280 +309 @@
-                            customStyle5.graphicOpacity,
-                            "graphicOpacity correctly set"); 
+                feature.style = customStyle6;
+                layer.drawFeature(feature);
+                var x = geometryX / renderer.getResolution();
+                var y = geometryY / renderer.getResolution();
+                t.eq(root.firstChild.style.left,
+                            (x + customStyle6.graphicXOffset).toFixed().toString()+'px',
+                            "graphicXOffset correctly set");
+                            
+                t.eq(root.firstChild.style.top,
+                            (y - (customStyle6.graphicYOffset+parseInt(root.firstChild.style.height))).toFixed().toString()+'px',
+                            "graphicYOffset correctly set");
-
-        }