Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I have an Openlayers map set up, it is all working well except in IE7 (which most of our users have) where performance is slow. I load in several layers of vector features and then switch these layers on/off using a custom 'layer switcher' which is some buttons/icons on the webpage.

In Chrome this works well, it's smooth and fast. IE7 is slow and there is usually a big delay when switching on a certain layer with 250 point features. The delay itself is ok, but it's easy for a user to think it hasn't worked and click the button again.

I decided to temporarily replace the button image with a loading image, make layer visible, then change button back to its correct image:

function toggle(buttonClicked) {
        button = document.getElementById(buttonClicked);
        var layer = map.getLayersByName(buttonClicked);
        if ( layer[0].visibility === false) {
            toggleButtonImg(buttonClicked, 'loading');
            layer[0].setVisibility(true);
            toggleButtonImg(buttonClicked, 'on');
        } else {
            layer[0].setVisibility(false);
            toggleButtonImg(buttonClicked, 'off');
        }

}

And the toggleButtonImg function:

function toggleButtonImg(buttonName, status){
        button = document.getElementById(buttonName);       
        if (status === "loading") {
            button.src = "images/loading.gif";              
        }else {
            button.src = "images/" + buttonName + "_" + status + ".png";
        }
    }

And if it helps, the button code:

<input type="image" onClick="toggle('Postcode')" id="Postcode" src="images/postcode_off.png">

The issue is, when you click the button the image doesn't change, the browser 'locks up' as it is loading the layer, then the button changes to the 'on' version. (off = greyed out, on = solid). I've added some extra code to the toggleButtonImg() in the hope the image would update before loading the layer:

button.src = "images/custSymb/loading.gif";
alert("hey the button should now have changed");

but I click, image stays 'off', alert appears, I ok it, image is still 'off', layer loads and image changes to 'on'.

Any ideas on how I can get around this issue and also any other tips to improve IE performance. e.g Will postcode_layer.removeAllFeatures(); be beneficial to perfomance when the postcode layer is not visible? (I realise I will have to reload it each time).

Thanks

share|improve this question
    
I've found the JavaScript parser in IE 8 and below tends to get bogged down when it's rendering even modest amounts of JavaScript. I suspect you're just seeing the wear on an expiring technology. :/ –  elrobis Apr 18 '13 at 14:28
1  
Thanks for your comment. Yeah it seems this is probably the case, which is a shame. –  BStone Apr 19 '13 at 14:50

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.