I downloaded an html/JS source from an Italian government site that allows you to add Polylines to the Google map using WMS (Web Map Service). Now I'm trying to adapt everything with Banano but not poor results.
The key steps are loading these two scripts
Inserting this code will initialize the map and insert images from WMS
I attach both the original source and the b4j source I am working on. Maybe someone has suggestions
The key steps are loading these two scripts
HTML:
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key="></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.6.2/proj4-src.min.js"></script>
JavaScript:
proj4.defs("WGS84", "+proj=longlat +ellps=WGS84 +datum=WGS84 +units=degrees");
proj4.defs("EPSG:6706", "+proj=longlat +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +no_defs");
var map;
var centro_italia= new google.maps.LatLng(41.898252, 12.496861);
var catOptions = {
getTileUrl: function(coord, zoom) {
return "https://wms.cartografia.agenziaentrate.gov.it/inspire/wms/ows01.php?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&BBOX="+bbox(coord.x,coord.y,zoom)+"&CRS=EPSG:6706&WIDTH=256&HEIGHT=256&LAYERS=province,CP.CadastralZoning,acque,CP.CadastralParcel,fabbricati,codice_plla,simbolo_graffa&STYLES=default&FORMAT=image/png&DPI=96&MAP_RESOLUTION=96&FORMAT_OPTIONS=dpi:96&TRANSPARENT=TRUE"
},
tileSize: new google.maps.Size(256, 256),
name: "Catasto",
opacity: 0.7
};
var catMapType = new google.maps.ImageMapType(catOptions);
function initialize () {
map = new google.maps.Map(document.getElementById('vuegmap1'), {
zoom: 13,
center: centro_italia,
mapTypeId: google.maps.MapTypeId.MAP,
disableDefaultUI: false,
zoomControl: true
});
map.overlayMapTypes.insertAt(0, catMapType);
}
google.maps.event.addDomListener(window, 'load', initialize);
function bbox(x,y,z) {
bl_lng=tile2long(x,z);
tr_lng=tile2long((x+1),z);
bl_lat=tile2lat(y+1,z);
tr_lat=tile2lat((y),z);
bl=proj4("WGS84","EPSG:6706",[bl_lng,bl_lat]);
tr=proj4("WGS84","EPSG:6706",[tr_lng,tr_lat]);
return bl[1]+","+bl[0]+","+tr[1]+","+tr[0];
}
function tile2long(x,z) {
return (x/Math.pow(2,z)*360-180);
}
function tile2lat(y,z) {
var n=Math.PI-2*Math.PI*y/Math.pow(2,z);
return (180/Math.PI*Math.atan(0.5*(Math.exp(n)-Math.exp(-n))));
}
I attach both the original source and the b4j source I am working on. Maybe someone has suggestions
Last edited: