Skip to content

Instantly share code, notes, and snippets.

@chrisarusso

chrisarusso/gist:d7d54a4149830a8baa6d

Last active April 4, 2023 11:23
Show Gist options
  • Star 7 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save chrisarusso/d7d54a4149830a8baa6d to your computer and use it in GitHub Desktop.
Save chrisarusso/d7d54a4149830a8baa6d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.txt
<html>
<head>
<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="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="leaflet-providers.js"></script>
</head>
<body>
<div id="map" style="width: 100%; height: 300px;"></div>
<script type="text/javascript">
var map = L.map('map');
var terrainTiles = L.tileLayer.provider('OpenTopoMap');
terrainTiles.addTo(map);
map.setView([35.9908385, -78.9005222], 3);
function addDataToMap(data, map) {
var dataLayer = L.geoJson(data, {
onEachFeature: function(feature, layer) {
var popupText = "Magnitude: " + feature.properties.mag
+ "<br>Location: " + feature.properties.place
+ "<br><a href='" + feature.properties.url + "'>More info</a>";
layer.bindPopup(popupText); }
});
dataLayer.addTo(map);
}
$.getJSON("http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojson", function(data) { addDataToMap(data, map); });
</script>
</body>
</html>
@mstangeo
Copy link

sorry,can you help me on this case.i have geojson imported in the map but i want apply different markericon on each.
so can you please explain to me

@nicoledan
Copy link

Is there any way to link to a JSON as a file? So that you could change the data if you wanted to? I've tried several methods that haven't worked.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment