Most probably geoJSON
layer does not show because data is not loaded yet when you add layer to the map. Try with this code:
var geojson = L.geoJson.ajax('StratfordBoundary', {style: StratStyle});
geojson.on('data:loaded', function() {
mymap.addLayer(this);
});
As PVar wrote, also make sure that geoJSON
file named StratfordBoundary
actually exists on home directory of your project on server.
EDIT1: If you run your code locally on file system, then you must add local: true
option to ajax call:
var geojson = L.geoJson.ajax('StratfordBoundary', {style: StratStyle, local: true});
EDIT2: The way you refer to leaflet.ajax.min.js
in the last incarnation of your question:
<script src="Z:\Leaflet\leaflet.ajax.min.js"><script>
will never work because of security reasons. Put your Leaflet
directory in the same directory where you have your project file and refer to it:
<script src="Leaflet/leaflet.ajax.min.js"><script>
The second problem is calling your project in browser from file system, not from server. Here you will have CORS (cross-origin) security problems. It also depends on the settings of the browser, but I managed to display map and geojson successefully from file system in Firefox, but not in Chrome or IE11. Crome reports the following error in console:
leaflet.ajax.js:373 Access to XMLHttpRequest at 'file:///C:/inetpub/wwwroot/LeafletExamples/geoJSON/StratfordBoundary.geojson'
from origin 'null' has been blocked by CORS policy:
Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.