С плитками osmappa.it это будет выглядеть так:
<body onload="init()">
<div id="map" id="map"></div>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
var map;
function init() {
var osmappa = new TileLayer({
source: new OSM({
attributions: [
'Tiles © <a href="https://www.osmappa.it/">osMap</a>',
ATTRIBUTION
],
url: 'https://osmap.{a-d}.tile.maphost.it/it/map/v1/{z}/{x}/{y}.png'
//ask them first if you can use those tiles!
})
});
// The overlay layer for our marker, with a simple diamond as symbol
var overlay = new OpenLayers.Layer.Vector('Overlay', {
styleMap: new OpenLayers.StyleMap({
externalGraphic: 'ico_soggiorno.png',
graphicWidth: 20, graphicHeight: 20, graphicYOffset: -20,
title: 'test'
})
});
// The location of our marker and popup. We usually think in geographic
// coordinates ('EPSG:4326'), but the map is projected ('EPSG:3857').
var myLocation = new OpenLayers.Geometry.Point( 13.1833326, 32.6833306 )
.transform('EPSG:4326', 'EPSG:3857');
// We add the marker with a tooltip text to the overlay
overlay.addFeatures([
new OpenLayers.Feature.Vector(myLocation, {tooltip: 'OpenLayers'})
]);
// Finally we create the map
map = new OpenLayers.Map({
div: "map", projection: "EPSG:3857",
layers: [osmappa, overlay],
center: myLocation.getBounds().getCenterLonLat(), zoom: 7
});
Это будет вариант вашего кода для использования итальянских плиток. Но сначала спросите их, может быть, вам понадобится apikey или тому подобное, потому что сейчас он выглядит так, как будто эти плитки загружаются только для osmappa.it, а не для других проектов.