[GIS] Openlayers Zoom based icon size

iconopenlayers-2style

I am displaying icon in feature. I want the size of icon to be dependent to zoom level of map i.e. the icon appears smaller in low zoom levels and bigger in high zoom levels. i used stylemap for that but the icon size does not change on zoom change.

var styleschool = new OpenLayers.Style({
            pointRadius: "${radius}",
            label:"${name}",
            fillOpacity: 0.7,
            fillColor:'blue',
            strokeColor:'blue',
            fontcolor:'blue',
            externalGraphic:'icon/school_color_icon.png'
        },
        {
            context:{
                radius: function(feature){
                    return map.getZoom()*0.9;
                }
            }
        })

Best Answer

pointRadius doesn't affect size of externalGraphic, you have to set graphicWidth and graphicHeight instead, try:

graphicWidth: "${radius}",
graphicHeight: "${radius}",
...

Related Solutions

OpenLayers 2 – How to Set Custom Center and Zoom Level for Zoom World Icon

In order to do this without modifying the actual source code for openlayers (which you won't be doing if you're using a minified version, which by default you probably are), look at this answer.

However, I had to change it slightly for my code, which is using OpenLayers 2.11

OpenLayers.Control.PanZoom.prototype.buttonDown = function(evt) {
            var btn = evt.currentTarget ? evt.currentTarget : this;
            switch (btn.action) {
                case "panup": 
                    this.map.pan(0, -this.getSlideFactor("h"));
                    break;
                case "pandown": 
                    this.map.pan(0, this.getSlideFactor("h"));
                    break;
                case "panleft": 
                    this.map.pan(-this.getSlideFactor("w"), 0);
                    break;
                case "panright": 
                    this.map.pan(this.getSlideFactor("w"), 0);
                    break;
                case "zoomin": 
                    this.map.zoomIn(); 
                    break;
                case "zoomout": 
                    this.map.zoomOut(); 
                    break;
                case "zoomworld": 
                    alert("Hello world!");
                    break;
            }
        };

The only difference between this code and the one in the answer linked is that instead of onButtonClick, we're using buttonDown, and rather than evt.buttonElement, we're using evt.currentTarget

EDIT: Internet Explorer has no currentTarget property in their event handling. Luckily, we can use this instead. I have modified the code above accordingly. For an explanation of this, please see this article. A relevant stackoverflow question is here.

[GIS] Problems with features, popups and strategy with OpenLayers

you can catch your opened(active) popup with this way:

map.popups[a]

you can change so update its content:

map.popups[a].contentHTML = 'Test Content';
map.popups[a].redraw();

or

map.popups[a].setContentHTML = 'Test Content'

you can show or hide your popup:

map.popups[a].show();
map.popups[a].hide();

you can update position of your popup:

map.popups[a].lonlat.lon = 10;
map.popups[a].lonlat.lat = 10;
map.popups[a].updatePosition();

for openlayers cluster you should check out Cluster Strategy Example here. Only one thing you should do is that define fillColor or externalGraphic for your cluster.

          var style = new OpenLayers.Style({
                pointRadius: "${radius}",
                fillColor: "${getColor}",
                fillOpacity: 0.8,
                strokeColor: "#cc6633",
                strokeWidth: 2,
                strokeOpacity: 0.8
            }, {
                context: {
                    radius: function(feature) {
                        return Math.min(feature.attributes.count, 7) + 3;
                    },
                    getColor: function(feature) {
                        return // Your color selection logic;
                    }
                }
            });

As the last question, i dont understand very well what you want? but try to use removeFeatures instead of destroyFeatures....

i hope it helps you...

Best Answer

Related Solutions

OpenLayers 2 – How to Set Custom Center and Zoom Level for Zoom World Icon

[GIS] Problems with features, popups and strategy with OpenLayers

Related Question