I have experience working in python but limited knowledge of Java Script.
I need help loading in a external Geojson located on my computer into a leaflet map. I read that I need to use a technique called JSONP in order to bypass cross-domain securities. This is where I am stuck. I got a map working by hard-coding a single data point, into the map, but I still have hundreds more so that is not a repeatable and viable option.
Data
This is the URL form of the geoJSON. I don't explicitly want to use the URL form as this is just a sample data set as I work through this problem. I have another data set that is only in JSON form. I will have to convert it to geoJSON before I can use in leaflet. If I am wrong in this knowledge, loading a json file into leaflet is my question.
geojson
optional json (bringing this into leaflet is my end goal if it is possible)
This is my working code
It has the map pulled up with the single point loading in as described above.
<html>
<head>
<title>A Leaflet map!</title>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="/js/leaflet-0.7.2/leaflet.ajax.min.js"></script>
<style>
#map{ width: 1000px; height: 600px; }
</style>
</head>
<body>
<div id="map"></div>
<script>
var map = L.map('map',{center: [35, -121],zoom: 7});
L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/tile/{z}/{y}/{x}', {attribution: 'Tiles © Esri — Sources: GEBCO, NOAA, CHS, OSU, UNH, CSUMB, National Geographic, DeLorme, NAVTEQ, and Esri'}).addTo(map);
var aa = {
"type": "Feature",
"properties": {
"name": "Coors Field"
},
"geometry": {
"type": "Point",
"coordinates": [-121, 35]
}
};
new L.GeoJSON(aa).addTo(map);
</script>
</body>
</html>
I have tried several tutorials on jsonp, but I just don't quite get the process yet.
