Buongiorno a tutti.
Ho installato un server locale con osm con la sola cartina dell’Italia. Il server funziona.
Ho preparato (da un esempio in rete) una pagina che nella mia idea doveva visualizzare la mappa dell’italia con al centro Roma.
Le coordinate impostate sono queste: latitudine: 41.9027835, longitudine: 12.4963655.
In effetti ciò non succede è visualizzata un ‘pezzo d’africa’ ! Però se navigo l’Italia la trovo.
Presumo che l’anomalia sia dovuta alla presenza della sola cartina italiana.
Qualcuno può aiutarmi?
Grazie
Ecco il codice:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Accessible Map</title>
<link rel="stylesheet" href="http://192.168.1.1/v5.3.0/css/ol.css" type="text/css">
<script src="http://192.168.1.1/v5.3.0/build/ol.js"></script>
<style>
a.skiplink {
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
}
a.skiplink:focus {
clip: auto;
height: auto;
width: auto;
background-color: #fff;
padding: 0.3em;
}
#map:focus {
outline: #4A74A8 solid 0.15em;
}
</style>
</head>
<body>
<a class="skiplink" href="#map">Go to map</a>
<div id="map" class="map" tabindex="0"></div>
<button id="zoom-out">Zoom out</button>
<button id="zoom-in">Zoom in</button>
<script>
var map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM({
url: 'http://192.168.1.1/osm/{z}/{x}/{y}.png'
})
})
],
target: 'map',
controls: ol.control.defaults({
attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
collapsible: false
})
}),
view: new ol.View({
center: [12.4963655, 41.9027835],
zoom:5
})
});
document.getElementById('zoom-out').onclick = function() {
var view = map.getView();
var zoom = view.getZoom();
view.setZoom(zoom - 1);
};
document.getElementById('zoom-in').onclick = function() {
var view = map.getView();
var zoom = view.getZoom();
view.setZoom(zoom + 1);
};
</script>
</body>
</html>