-1

I have a google map that loads markers from a GeoJSON file that runs on localhost in Visual Studio 2013. It also runs in chrome (from an IIS server) but will not run in IE version 11. The map shows up, but the markers from the JSON file do not. Why would this work in Chrome on IIS 8, and IE 11 through VS, but not IE 11 on IIS 8?

    var map;
    var infowindow = new google.maps.InfoWindow({ });

    function initialize() {

            map = new google.maps.Map(document.getElementById('googleMap'), {
            center: new google.maps.LatLng(15.508742, -0.120850),
            zoom: 2,
            mapTypeId: google.maps.MapTypeId.HYBRID,
            scrollwheel: false 
        });

        google.maps.event.addListener(map, 'click', function() {
            infowindow.close();
        });

        // Load a GeoJSON from the same server as our demo.
        map.data.loadGeoJson('locations.json');

        // Set event listener for each feature.
        map.data.addListener('click', function (event) {
            infowindow.setContent("<div> " + event.feature.getProperty('city') + " " + event.feature.getProperty('date') + "<br>" + event.feature.getProperty('course') + "<br>Sponsored by: " + event.feature.getProperty('sponsor') + "<br>" + "<a href=" + "/Training.aspx" + ">Click here to Register</a>" + "</div>");
            infowindow.setPosition(event.latLng);
            infowindow.setOptions({ pixelOffset: new google.maps.Size(0, -34) });
            infowindow.open(map);

        });

        map.data.addListener('mouseover', function (event) {
            //infowindow.setContent("<div class=\"map_info_box\" > " + event.feature.getProperty('city') + " " + event.feature.getProperty('date') + "<br>" + event.feature.getProperty('course') + "<br>Sponsored by: " + event.feature.getProperty('sponsor') + "<br>" + "<a href=" + "/Training.aspx" + ">Click here to Register</a>" + "</div>");
            infowindow.setContent("<div> " + event.feature.getProperty('city') + " " + event.feature.getProperty('date') + "<br>" + event.feature.getProperty('course') + "<br>Sponsored by: " + event.feature.getProperty('sponsor') + "<br>" + "<a href=" + "/Training.aspx" + ">Click here to Register</a>" + "</div>");
            infowindow.setPosition(event.latLng);
            infowindow.setOptions({ pixelOffset: new google.maps.Size(0, -34) });
            infowindow.open(map);
        });

    }

    google.maps.event.addDomListener(window, 'load', initialize);
Sasquatch
  • 1
  • 5
  • 2
    And what basic debugging have you done? – Andy Oct 31 '14 at 16:00
  • Is there a `addGeoJSON` method you can use? [It seems you can use that to load local data.](http://stackanswers.com/questions/25334931/loading-a-local-geojson-file-and-using-it-with-the-google-maps-javascript-api-v3) – Andy Oct 31 '14 at 16:05
  • Thanks for the quick response Andy. The JSON data is dynamic and the file will be generated from a table in Sql Server which is why the locations do not need to be in the script itself. – Sasquatch Oct 31 '14 at 16:11
  • Yes, but you're loading a single file from the server. It looks like you can use `addGeoJSON`. – Andy Oct 31 '14 at 16:14
  • Sounds like a security setting on the browser. Does the javascript console tell you anything useful? – geocodezip Oct 31 '14 at 17:40

1 Answers1

0

Compatibility view in IE prevented the loading of the geoJSON file. I put

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

at the top of the page and it solved the issue.

Many thanks to geocodezip who pointed me in the right direction in the comments above.

Sasquatch
  • 1
  • 5