Polyline refuses to show on IE8, works everywhere else

Question

I've got a custom .NET app using COM exposed objects to render GPS routes collected. It works brilliantly on every platform other than Windows XP running IE8 (wrapped via WebBrowser control in .NET).

To test it out, I've written a test map application, which uses the same object model but slimmed down, so I can debug, so far I'm being presented with IE Script Errors that state:

Line: 319 Char: 17 Error: String expected Code: 0 URL: about:blank

The line it's referring to is:

driverPathPoints[id] = [];

The code for rendering routes is as follows:

function ShowRoute(path, id, col) {

            try {
                clearRoutePaths(id);
            }
            catch (err) { }

            driverPathPoints[id] = [];
            driverDeliveryRouteMarkers[id] = [];

            var pointMarkers = [];
            var pointCounter = 0;
            for (var i = 0; i < path.Count(); i++) {
                driverPathPoints[id].push(new google.maps.LatLng(
                    path.item(i).lat, path.item(i).lng));

                if (pointCounter % 20 === 0) {
                    var marker = new google.maps.Marker({
                        position: new google.maps.LatLng(path.item(i).lat, path.item(i).lng),
                        title: path.item(i).deviceTime + " (" + Math.ceil(path.item(i).speed) + " MPH)",
                        infoParent: id,
                        infoIndex: i
                    });

                    pointMarkers.push(marker);
                }

                pointCounter++;
            }

            markerClusterer[id] = new MarkerClusterer(map, pointMarkers);

            var secondToLastLat = path.item(path.Count() - 2).lat;
            var secondToLastLng = path.item(path.Count() - 2).lng;

            var lastLat = path.item(path.Count() - 1).lat;
            var lastLng = path.item(path.Count() - 1).lng;

            var routeOptions = {
                path: driverPathPoints[id],
                strokeColor: col,
                strokeOpacity: 1.0,
                strokeWeight: 4,
                map: map,
                customIdent: id
            };

            var truckImage = 'http://ccgi.ablebox.plus.com/map_imgs/truck_' + calculateBearing(lastLat, lastLng, secondToLastLat, secondToLastLng) + '.png';

            var MarkerImage = new google.maps.MarkerImage(truckImage,
                new google.maps.Size(120, 120),
                new google.maps.Point(0, 0),
                new google.maps.Point(60, 60));

            var MarkerOption = {
                map: map,
                position: new google.maps.LatLng(path.item(path.Count() - 1).lat, path.item(path.Count() - 1).lng),
                icon: MarkerImage
            };

            var Marker = new google.maps.Marker(MarkerOption);
            driverDeliveryRouteMarkers[id].push(Marker);

            driverGPSDataLayer[id] = new google.maps.Polyline(routeOptions);

            driverGPSDataLayerCount++;
        }

Does anyone have any idea how I can fix this? Before, (while developing) I was able to debug scripts. But I'm running Windows 8 and only have an XP SP3 VM running, but can't debug on it. Was hoping some JS guru could point me in the right direction.

Many thanks.

Edit I've just chucked my code through a jslint, and it has no 'problems'. I've tried creating a temporary array to fill, and assign that to the layer I'm working with. No change. I've tried the !DOCTYPE html 'fix' no change.

I have no idea why it thinks driverPathPoints[] should be a string. Will continue onward.

Answer 1

Sussed it. Was due to IE8 not knowing what a Long datatype was for id in: driverPathPoints[id] = []; (being sent from .NET VB app). As soon as I converted it to a string and sent that as parameter of InvokeScript it was quite happy on XP and IE8.

Thanks :)