OpenLayers OpenLayers

Changeset 3276

Show
Ignore:
Timestamp:
06/07/07 04:02:37 (1 year ago)
Author:
ahocevar
Message:

#736; graphicWidth and graphicHeight implemented: if both are
set, the aspect ratio of the image will be ignored. If one is
set, the aspect ratio will be kept. If none is set, then the
size will be taken from pointRadius and multiplied by 2.

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved

  • sandbox/camptocamp/externalGraphics/examples/vector-features.html

    r3272 r3276  
    2323            style_blue.fillColor = "blue";  
    2424            style_blue.externalGraphic = "../img/marker.png"; 
     25             
     26            // each of the three lines below means the same, if only one ot 
     27            // them is active: the image will have a size of 24px, and the 
     28            // aspect ratio will be kept 
    2529            style_blue.pointRadius = 12; 
     30            //style_blue.graphicWidth = 24; 
     31            //style_blue.graphicHeight = 24; 
     32             
     33            style_blue.fillOpacity = 1; 
    2634            var style_green = { 
    2735                strokeColor: "#00FF00", 
    …… 
    3139                pointerEvents: "visiblePainted" 
    3240            }; 
     41            var style_mark = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']); 
     42             
     43            // if graphicWidth and graphicHeight are both set, the aspect ratio 
     44            // of the image will be ignored 
     45                        style_mark.graphicWidth = 24; 
     46                        style_mark.graphicHeight = 20; 
     47                         
     48                        style_mark.externalGraphic = "../img/marker.png";            
    3349             
    3450            var vectorLayer = new OpenLayers.Layer.Vector("Simple Geometry"); 
    …… 
    4056            var pointFeature2 = new OpenLayers.Feature.Vector(point2,null,style_green); 
    4157            var point3 = new OpenLayers.Geometry.Point(-105.04, 49.68); 
    42             var pointFeature3 = new OpenLayers.Feature.Vector(point3,null,style_blue); 
     58            var pointFeature3 = new OpenLayers.Feature.Vector(point3,null,style_mark); 
    4359             
    4460            // create a line feature from a list of points 

  • sandbox/camptocamp/externalGraphics/lib/OpenLayers/Renderer/SVG.js

    r3272 r3276  
    184184 
    185185                // now style the new node 
    186                 var radius = style.pointRadius; 
    187                 node.setAttributeNS(null, "x", x-radius); 
    188                 node.setAttributeNS(null, "y", -y-radius); 
    189                 node.setAttributeNS(null, "width", 2*radius); 
    190                 node.setAttributeNS(null, "height", 2*radius); 
     186                if (style.graphicWidth && style.graphicHeight) { 
     187                  node.setAttributeNS(null, "preserveAspectRatio", "none"); 
     188                } 
     189                var width = style.graphicWidth || style.graphicHeight; 
     190                var height = style.graphicHeight || style.graphicWidth; 
     191                width = width ? width : style.pointRadius*2; 
     192                height = height ? height : style.pointRadius*2; 
     193                 
     194                node.setAttributeNS(null, "x", x-(.5*width).toFixed()); 
     195                node.setAttributeNS(null, "y", -y-(.5*height).toFixed()); 
     196                node.setAttributeNS(null, "width", width); 
     197                node.setAttributeNS(null, "height", height); 
    191198                node.setAttributeNS("http://www.w3.org/1999/xlink", "href", style.externalGraphic); 
    192199                node.setAttributeNS(null, "transform", "scale(1,-1)"); 

  • sandbox/camptocamp/externalGraphics/lib/OpenLayers/Renderer/VML.js

    r3272 r3276  
    149149                fill.src = style.externalGraphic; 
    150150                fill.type = "frame"; 
    151                 fill.aspect = "atmost"; 
    152                 node.style.flip = "y";  
     151                node.style.flip = "y"; 
     152                 
     153                if (!(style.graphicWidth && style.graphicHeight)) { 
     154                  fill.aspect = "atmost"; 
     155                } 
    153156                 
    154157                // now style the new node 
    155                 var radius = style.pointRadius; 
     158                var width = style.graphicWidth || style.graphicHeight; 
     159                var height = style.graphicHeight || style.graphicWidth; 
     160                width = width ? width : style.pointRadius*2; 
     161                height = height ? height : style.pointRadius*2; 
    156162                var resolution = this.getResolution(); 
    157                 node.style.left = (geometry.x/resolution-radius).toFixed(); 
    158                 node.style.top = (geometry.y/resolution-radius).toFixed(); 
    159                 node.style.width = 2*radius; 
    160                 node.style.height = 2*radius;      
     163                node.style.left = (geometry.x/resolution-.5*width).toFixed(); 
     164                node.style.top = (geometry.y/resolution-.5*height).toFixed(); 
     165                node.style.width = width; 
     166                node.style.height = height;     
    161167                 
    162168                // modify fill style for rect styling below