Chrome更新38.0.2125.104 m后，Google Map API v3不显示多边形

Question

I updated Chrome browser on 10/17/2014. After this I was not able to see polygon drawn on Google Maps v3 Javascript in Chrome. In IE it is working perfectly and before Chrome latest update it was working fine on Chrome too.

Please let me know if I need to put any fix to show up in Chrome.

Following code is being used to create Polygon of radius Ring. Json Object is being passed to the method and it is being used to draw the polygon on mapInstance of google Map.

EDRV2.EDRMAPV3GOOGLEV3.Map.prototype.createPolylines = function(category, subcategory, polylineJSONObjects, showOnMap) {
    var polylines = [];
    var pts = null;
    var rawPairs = null;
    var rawLngLat = null;

    try {
        for (var i = 0; i < polylineJSONObjects.length; i++) {
            var polygonType = null;

            switch (category) {
                case EDRV2.LIGHTBOX.INTERNAL.SiteCategoryTypes.CONTOUR:
                    polygonType = EDRV2.EDRMAPV3.EnumPolygonTypes.CONTOUR;
                    break;
                case EDRV2.LIGHTBOX.INTERNAL.SiteCategoryTypes.RADIUSRING:
                    polygonType = EDRV2.EDRMAPV3.EnumPolygonTypes.RADIUSRING;
                    break;
                case EDRV2.LIGHTBOX.INTERNAL.SiteCategoryTypes.QUICKSCREENQUADRANT:
                    polygonType = EDRV2.EDRMAPV3.EnumPolygonTypes.QUICKSCREENQUADRANT;
                    break;
            }

            polylines.push(new EDRV2.EDRMAPV3GOOGLEV3.Polyline(polygonType, this.mapInstance, polylineJSONObjects[i].coordinates, polylineJSONObjects[i].normalPolyAttributes, polylineJSONObjects[i].highlightPolyAttributes, polylineJSONObjects[i].normalPolyAttributes.mapLabelText));
        }

        var mapObjectCollection = this.mapObjectAddRange(category, subcategory, EDRV2.EDRMAPV3.EnumMapObjectTypes.POLYLINE, polylines);
        mapObjectCollection.isActivated = true;

        if (showOnMap == true) {
            for (var j = 0; j < mapObjectCollection.mapObjects.length; j++) {
                mapObjectCollection.mapObjects[j].setMap(this.mapInstance);
            }
        }
    } catch (ex) {
        throw new Error("Unable to create Polylines: " + ex.message);
    }
};

EDRV2.EDRMAPV3GOOGLEV3.Polyline = function (polyType, googleMap, dvgCoordinatesString, normalPolyAttributes, highlightPolyAttributes, labelText) {
// Constructor
if (this instanceof EDRV2.EDRMAPV3GOOGLEV3.Polyline) {
    try {
        // inheritance
        google.maps.Polyline.apply(this, arguments);
        this.base = google.maps.Polyline.prototype;

        var pts = null;
        var rawPairs = null;
        var rawLngLat = null;

        // validate map
        if ((typeof (googleMap) == 'undefined') || (googleMap == null)) throw new Error('Missing or invalid googleMap.');
        if (!(googleMap instanceof google.maps.Map)) throw new Error('googleMap is not of google.maps.Map type.');

        // validate coordinates
        if ((typeof (dvgCoordinatesString) == 'undefined') || (dvgCoordinatesString == null)) throw new Error('Missing or invalid polyline coordinates.');

        dvgCoordinatesString = EDRV2.trim(dvgCoordinatesString);
        if (dvgCoordinatesString == '') throw new Error('Missing or invalid polyline coordinates.');

        // Code to convert DVG coordinates to Google Map LatLng corodinates.
        pts = new Array;
        rawPairs = dvgCoordinatesString.split('|');

        for (var i = 0; i < rawPairs.length; i++) {
            rawLngLat = (rawPairs[i]).split(',');
            if ((rawLngLat[0] != '') && (rawLngLat[1] != '')) { pts.push(new google.maps.LatLng(rawLngLat[1], rawLngLat[0])); }
        }

        // Now initialize all properties. 
        this.polyType = polyType;
        this.googleMap = googleMap;
        this.normalPolyOptions = this.convertEdrPolyAttributesToGooglePolylineOptions(normalPolyAttributes);
        this.highlightPolyOptions = this.convertEdrPolyAttributesToGooglePolylineOptions(highlightPolyAttributes);
        this.labelText = labelText;

        // Call setPaths to define the paths of the polyline and then convert normalPolyAttributes to Google Polyline Options.
        this.setPath(pts);

        if ((typeof (this.normalPolyOptions) != 'undefined') && (this.normalPolyOptions != null)) {
            this.setOptions(this.normalPolyOptions);
        }

        switch (this.polyType) {
            case EDRV2.EDRMAPV3.EnumPolygonTypes.CONTOUR:
                google.maps.event.addListener(this, 'mouseover', this.onMouseOver);
                google.maps.event.addListener(this, 'mouseout', this.onMouseOut);
                google.maps.event.addListener(this, 'click', function (e) { EDRV2.EventCollector.fire({ type: EDRV2.EDRMAPV3.EnumEventNames.EDRMAPV3_CONTOUR_POLYLINECLICK, clickLatLng: e.latLng }); });
                break;
        }

        this.createLabels(labelText);
        this.isUsable = true;
    }
    catch (ex) {
        this.isUsable = false;
        this.errorMessage = 'Unable to create Polyline object: ' + ex.message;
    }
}
else { return new EDRV2.EDRMAPV3GOOGLEV3.Polyline(polyType, googleMap, dvgCoordinatesString, normalPolyAttributes, highlightPolyAttributes, labelText); }

};

Answer 1

I got the issue. Thanks to everyone. Just want to share it as this is something happening after new Chrome update.

google.maps.Polyline.apply(this, arguments); is breaking in Chrome and gives a read only exception. I removed 'apply' and used 'call' and it worked. This means that Chrome is breaking apply for Polyline.

google.maps.Polyline.call(this, arguments);