[OpenLayers-Users] Icon in my map using his natural size

pvrsouza pvrsouza at gmail.com
Tue Mar 25 14:32:57 PDT 2014


Arnd,

Thanks for your reply..

I tried something like that, but in this case the img object just has its
width attribute after a load function. See the comment, plesae.

        var context = {
        getGraphic : function (ft){
            var graphicUrl = "./" + ft.attributes["icon"];
            return graphicUrl;
        },
        getGraphicW : function (ft){
         var toReturn;
            var img = new Image();
            img.onload = function() {
         toReturn = this.width; // At this point I was unable to pass the
method's return to getGraphicW function.
     };
     img.src = "./" + ft.attributes["icon"];

            return toReturn; //at this point toReturn is empty. :-(
        },
        getGraphicH : function (ft){
            var img = new Image();
            img.src = "./" + ft.attributes["icon"];
            return img.height;
        }
    };




2014-03-25 18:05 GMT-03:00 Arnd Wippermann [via OSGeo.org] <
ml-node+s1560n5131079h65 at n6.nabble.com>:

> You can try to get width an height with new Image()
>
>     var styleMapIcon;
>
>     var context = {
>         getGraphic : function (ft){
>             var graphicUrl = "./" + ft.attributes["icon"];
>             return graphicUrl;
>         },
>         getGraphicW : function (ft){
>             var img = new Image();
>             img.src = "./" + ft.attributes["icon"];
>             return img.width;
>         },
>         getGraphicH : function (ft){
>             var img = new Image();
>             img.src = "./" + ft.attributes["icon"];
>             return img.height;
>         }
>     };
>     var templateDefault = {
>         fillOpacity: 0.5,
>         pointerEvents: "visiblePainted",
>         externalGraphic:"${getGraphic}",
>         graphicWidth:"${getGraphicW}",
>         graphicHeight:"${getGraphicH}"
>     };
>
>     var templateSelect = {
>         fillOpacity: 1,
>         pointRadius: 60,
>         pointerEvents: "visiblePainted",
>         externalGraphic:"${getGraphic}",
>         graphicWidth:null,
>         graphicHeight:null
>     };
>     styleMapIcon = new OpenLayers.StyleMap( {
>             "default" : new OpenLayers.Style(templateDefault,
> {context:context}),
>             "select"  : new OpenLayers.Style(templateSelect,
> {context:context})
>     });
>     return(styleMapIcon);
>
> Arnd
>
> -----Ursprüngliche Nachricht-----
> Von: [hidden email] <http://user/SendEmail.jtp?type=node&node=5131079&i=0>
> [mailto:[hidden email]<http://user/SendEmail.jtp?type=node&node=5131079&i=1>]
> Im Auftrag von pvrsouza
> Gesendet: Dienstag, 25. März 2014 11:33
> An: [hidden email] <http://user/SendEmail.jtp?type=node&node=5131079&i=2>
> Betreff: [OpenLayers-Users] Icon in my map using his natural size
>
> Hello everybody,
>
> It's my first time here and I didn't find any topic like this one here.
> Then
> here we go:
>
> I'd like to show the Icon in my map using his natural size (width and
> height
> original). How can i do it?
>
> Now i have this code:
>
> var contextResource =
> {
>         getWidthIcon : function(feature){
>                 //i'm trying to get the current width
>     },
>     getHeightIcon : function(feature){
>                 //i'm trying to get the current height
>                 },
>
>         getMarker : function(feature)
>      {
>                 // getting the icon with a rest reponse
>                 var lstIcons = feature.attributes.satellites;
>                 var sUrlIcon =
> "${sBaseURL}/AvlCore/rest/icon/resource/composed/"+
> feature.attributes.orientation;
>                 for ( var n = 0; n < lstIcons.length; n++) {
>                         sUrlIcon = sUrlIcon + "/" + lstIcons[n];
>                 }
>                 return sUrlIcon;
>         },
>         getBackgroundMarker : function(feature)
>         {
>                 ///blah blah blah
>             }
>
>                 return urlBackground;
>         },
>         getVisibility : function(feature)
>         {
>                 ///blah blah blah
>         },
>         getLabel : function(feature)
>         {
>                 ///blah blah blah
>         }
>
> };
>
> //This is my style builder
> var resourceStyle = new OpenLayers.Style({
>         externalGraphic : '<% out.print("${getMarker}"); %>',
>         backgroundGraphic : '<% out.print("${getBackgroundMarker}"); %>',
>         graphicOpacity: 1,
>         graphicWidth: '<% out.print("${getWidthIcon}"); %>',
>         graphicHeight:'<% out.print("${getHeightIcon}"); %>',
>         label: '<% out.print("${getLabel}"); %>',
>         fontFamily: "Arial",
>         fontSize: '11px',
>         labelYOffset: -30,
>         labelOutlineColor: "white",
>         labelOutlineWidth: 3,
>         display: '<% out.print("${getVisibility}"); %>'
> }, { context: contextResource });
>
> If I put a fixed graphicWidth and graphicHeight works normally. I want to
> display icons in different sizes. Is it possible using this strategy?
>
> Thanks
>
>
>
> --
> View this message in context:
>
> http://osgeo-org.1560.x6.nabble.com/Icon-in-my-map-using-his-natural-size-tp
> 5130893.html
> Sent from the OpenLayers Users mailing list archive at Nabble.com.
> _______________________________________________
> Users mailing list
> [hidden email] <http://user/SendEmail.jtp?type=node&node=5131079&i=3>
> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>
> _______________________________________________
> Users mailing list
> [hidden email] <http://user/SendEmail.jtp?type=node&node=5131079&i=4>
> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>
>
> ------------------------------
>  If you reply to this email, your message will be added to the discussion
> below:
>
> http://osgeo-org.1560.x6.nabble.com/Icon-in-my-map-using-his-natural-size-tp5130893p5131079.html
>  To unsubscribe from Icon in my map using his natural size, click here<http://osgeo-org.1560.x6.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=5130893&code=cHZyc291emFAZ21haWwuY29tfDUxMzA4OTN8MjEyOTgwODc5MQ==>
> .
> NAML<http://osgeo-org.1560.x6.nabble.com/template/NamlServlet.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-nabble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabble%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21nabble%3Aemail.naml>
>



-- 
Atenciosamente,

Pablo Souza
Twitter: @pvrsouza
Tel.: (71) 9983-7775




--
View this message in context: http://osgeo-org.1560.x6.nabble.com/Icon-in-my-map-using-his-natural-size-tp5130893p5131083.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/openlayers-users/attachments/20140325/7d0c90a7/attachment.html>


More information about the Users mailing list