<!doctype html>
<html lang="pt">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<link rel="stylesheet" href="leaflet.css" />
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="leaflet.js"></script>
<script src="leaflet.ajax.min.js"></script>
</head>
<body style="margin:0; padding:0">
<div class="splash-container"> <!-- id="map" style="top: 5em; height: 77%">-->
<div id="map" style="width:350px; height: 340px"></div>
</div>
<script>
var map = L.map('map', {}).setView([-18, -58], 3);
// Basemaps
// For the entire list, see https://leaflet-extras.github.io/leaflet-providers/preview/
var Esri_WorldPhysical = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Physical_Map/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles © Esri — Source: US National Park Service',
maxZoom: 8
});
var Acetate_terrain = L.tileLayer('http://a{s}.acetate.geoiq.com/tiles/terrain/{z}/{x}/{y}.png', {
attribution: '©2012 Esri & Stamen, Data from OSM and Natural Earth',
subdomains: '0123',
minZoom: 2,
maxZoom: 18
});
var Acetate_basemap = L.tileLayer('http://a{s}.acetate.geoiq.com/tiles/acetate-base/{z}/{x}/{y}.png', {
attribution: '©2012 Esri & Stamen, Data from OSM and Natural Earth',
subdomains: '0123',
minZoom: 2,
maxZoom: 18
});
var Hydda_Base = L.tileLayer('http://{s}.tile.openstreetmap.se/hydda/base/{z}/{x}/{y}.png', {
attribution: 'Tiles courtesy of <a href="http://openstreetmap.se/" target="_blank">OpenStreetMap Sweden</a> — Map data © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
});
var Esri_WorldTerrain = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles © Esri — Source: USGS, Esri, TANA, DeLorme, and NPS',
maxZoom: 8
});
Esri_WorldPhysical.addTo(map);
// Style
var point = {
radius: 2,
fillColor: "#ff7800",
color: "#000",
opacity: 1,
fillOpacity: 0.8
};
geojson = new L.GeoJSON.AJAX("data.php?loc=Rio de Janeiro", {
/*pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, point);
}*/
});
geojson.addTo(map);
</script>
</body>
</html>