Invalid Argument error in IE8 when drawing point features with Openlayers in AJAX application

I would kindly request some help because I have been struggling with an issue occurring only in IE8 with my code. You can take a look at a demo page that illustrates the problem at http://www.europeontrack.com/test.html. As you’ll notice, it works fine Firefox, Chrome, Safari, but in IE8, it triggers the Javascript Error “Invalid Argument” in openlayers.js line 684, character 178.

This page begins by initializing an openlayers map object and declaring an empty cityLayer vector layer which we’ll use later to draw points. A link “show city list” asynchronously calls http://www.europeontrack.com/cityList.html and inserts it in the DOM. cityList.html declares an array where the names, latitudes and longitudes of a few cities are stored. This array is then passed as argument to the showCities() function which is declared in test.html as follows:

function showCities(cities,layer) {
    var开发者_如何学Python pointFeatures = [] ;
    for ( i = 0 ; i < cities.length ; i++) {
        pointFeatures[i] = new OpenLayers.Feature.Vector(
            newOpenLayers.Geometry.Point(cities[i]['long'],
                cities[i]'lat']).transform(
                map.displayProjection,map.baseLayer.projection));
        pointFeatures[i].attributes = { label: cities[i]['label'] };
    }
    cityLayer.addFeatures(pointFeatures);
    return false ;
}

In IE8, only the first city contained in the ‘cities’ array is drawn and then the browser throws the “Invalid Argument” error. You can take a look at my source code. I think I’ve stripped it down to the minimum. I’m stuck at this point trying to troubleshoot this issue. Thank you in advance for your help.

Lothaire

I've looked at it and can reproduce the error with the public OL build. But using my own copy of OL 2.9.1 it works in IE and FF.

I have done small modifications to the downloaded files, but only in a popup class, so that shouldn't affect your code. Try to download OpenLayers 2.9.1 and see if your app works with that version. Or just begin with a debug version of OL (un-compressed), and try to see what line of code produces the error. Much easier when not looking at minified code. :-)

Thank you guys for looking into it - but I'm ashamed to say I've made a careless mistake in the definition of my stylemap, which didn't impact most browsers except IE8 and which in fact was the cause of the problem. All this time I was trying to debug, looking at the wrong place.

Here was my mistake:

styleMap = new OpenLayers.StyleMap({
    'default':{
        strokeColor: "#FFFFFF",
        strokeOpacity: 1,
        strokeWidth: 2,
        fillColor: "#852C71",
        fillOpacity: 1,
        pointRadius: 4,
        pointerEvents: "visiblePainted",
        label : "${label}",                   
        fontColor: "#000000",
        fontSize: "10px",
        fontFamily: "Verdana",
        fontWeight: "bold",
        labelAlign: **"${align}",**
        labelXOffset: **"${xOffset}",**
        labelYOffset: "-10"
    }
});

I specified 2 variables (${align}, ${xOffset}) in the styleMap for which I was not passing any value when adding features to my vector layer. This caused IE to break, whereas other browsers where ignoring it. I replaced those variables by a fixed value and it resolved the IE8 issue. Apologies for this stupid mistake on my part. Thanks for looking into it.

Lothaire