64 lines
1.7 KiB
HTML
64 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<title>Leaflet Test</title>
|
|
|
|
<link rel="stylesheet" href="lib/leaflet.css"
|
|
integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
|
|
crossorigin=""/>
|
|
<link rel="stylesheet" href="lib/MarkerCluster.Default.css"/>
|
|
|
|
<style type="text/css">
|
|
#mapid { height: 1000px; }
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div id="mapid"/>
|
|
|
|
</body>
|
|
|
|
<script src="lib/leaflet.js"
|
|
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
|
|
crossorigin=""></script>
|
|
<script src="lib/jquery-3.6.0.min.js"></script>
|
|
<script src="lib/leaflet.markercluster.js"></script>
|
|
|
|
<script type="text/javascript">
|
|
var mymap = L.map('mapid').setView([43.016844, -78.741447], 12);
|
|
|
|
// var tiles = "https://odin.cse.buffalo.edu/public_data/2021-osm-new-york/{id}/{z}/png/{x}/{y}.png"
|
|
var tiles = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
|
|
|
|
L.tileLayer(tiles, {
|
|
attribution: 'Map data © <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
|
|
maxZoom: 18,
|
|
id: 'tiles-12/default',
|
|
tileSize: 256,
|
|
zoomOffset: 0,
|
|
}).addTo(mymap);
|
|
|
|
$.getJSON("Layers/AMS-USDA-Directories-Farms.csv", function( data ) {
|
|
|
|
var markers = L.markerClusterGroup();
|
|
|
|
for(point in data){
|
|
L.geoJSON(
|
|
data[point]
|
|
).addTo(markers)
|
|
}
|
|
|
|
markers.bindPopup(function(element){
|
|
return element.feature.properties.popup
|
|
}).bindTooltip(function(element){
|
|
return element.feature.properties.tooltip
|
|
})
|
|
|
|
markers.addTo(mymap)
|
|
})
|
|
|
|
</script>
|
|
</html>
|