Template:XsysGmap >
Template:XsysGmap
Indice (TOC)
Nessuna testata/* ------ parametri accettati dallo script ------ */
/*
gmapopt ($0) - parametri mappa: - zoom -> livelo di zoom
- lat -> latitudine del centro mappa
- lng -> longitudine del centro mappa
- mapType -> tipo di mappa (SATELLITE, ROADMAP, ...)
- mapStyle -> stile mappa (l'array dello stile)
- markerImg -> l'immagine del marker
- width -> la larghezza della mappa
- height -> l'altezza della mappa
- max_zoom -> livelo massimo di zoom
p ($1) - la path dove cercare i punti;
itinerari ($2) - parametri del itinerario: - nome_itinerario -> il nome dell'itinerario (da visualizzare nel menu a tendina)
- overlayImg -> la path dell'immagine che verrà sovrapposta sulla mappa
- latNE -> latitudine del angolo in alto a destra
- lngNE -> longitudine del angolo in alto a destra
- latSW -> latitudine del angolo in basso a sinistra
- lngSW -> longitudine del angolo in basso a sinistra
marker_opt ($3) - parametri del marker: - lista di mappe contenete: lat, lng, page_id, marker_img.
Per ogni punto della lista dei punti per cui marker_opt.lat(lng,page_id)==punti.lat(lng, page_id) si va ad aggiungere la marker_img
- lat -> latitudine del marker
- lng -> longitudine del marker
- page_id -> l'id della pagina del punto
- marker_img -> l'imagine del marker
*/
var gmapopt = $gmapopt ?? $0 ?? {};
var p = $path ?? $1 ?? page.path.."/*";
var itinerari = $itinerari ?? $2 ?? [];
var marker_opt = $marker_opt ?? $3 ?? [];
var overlayImg = "";
var latNE = "0";
var lngNE = "0";
var latSW = "0";
var lngSW = "0";
var zoom = gmapopt.zoom ?? "8";
var max_zoom = gmapopt.max_zoom ?? "";
var lat = gmapopt.lat ?? "45.07056";
var lng = gmapopt.lng ?? "7.68662";
var mapType = gmapopt.mapType ?? "none";
var mapStyle = gmapopt.mapStyle ?? "[
{
featureType: 'administrative.country',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},{
featureType: 'poi',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},{
featureType: 'road.highway',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},{
featureType: 'administrative.neighbourhood',
elementType: 'all',
stylers: [
{ visibility: 'simplified' }
]
},{
featureType: 'poi',
elementType: 'all',
stylers: [
]
},{
featureType: 'road.arterial',
elementType: 'all',
stylers: [
{ saturation: 86 },
{ lightness: 91 }
]
},{
featureType: 'road.highway',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},{
featureType: 'poi',
elementType: 'all',
stylers: [
{ lightness: 41 }
]
},{
featureType: 'all',
elementType: 'all',
stylers: []
},{
featureType: 'transit.station.rail',
elementType: 'all',
stylers: [ { visibility: 'off' } ]
},{ featureType: 'transit.station',
elementType: 'all',
stylers: [ { visibility: 'off' } ]
},{
featureType: 'road.local',
elementType: 'all',
stylers: [ { visibility: 'on' } ]
},{
featureType: 'administrative.locality',
elementType: 'all',
stylers: [ { visibility: 'on' } ] }
]";
var markerImg = gmapopt.markerImg ?? "";/*"http://www.primolevi.it/@api/deki/files/737/=cerchio_mappa.png";*/
var width = gmapopt.width ?? "675px";
var height = gmapopt.height ?? "350px";
/* ===================== itinerario ==========================*/
var ispredit = (__request.args['ispredit'] ?? false);
var itinerario = (__request.args['itinerario'] ?? "");
if(#itinerari > 1 && !ispredit){
<div class="form_itinerario">
<form action="itinerario" action="" method="get">
<select name="itinerario">
foreach (var i in itinerari){
if(i.nome_itinerario == itinerario){
<option value=(i.nome_itinerario) selected="selected">i.nome_itinerario;</option>
}else{
<option value=(i.nome_itinerario)>i.nome_itinerario;</option>
}
}
</select>
<input type="submit" value="Scegli l'Itinerario" />
</form>
</div>
if(#itinerario >0){
var tmp = list.select(itinerari, "$.nome_itinerario == '"..itinerario.."'");
let overlayImg = tmp[0].overlayImg ?? "";
let latNE = tmp[0].latNE ?? "0";
let lngNE = tmp[0].lngNE ?? "0";
let latSW = tmp[0].latSW ?? "0";
let lngSW = tmp[0].lngSW ?? "0";
}
}else if(#itinerari == 1 && !ispredit){
let overlayImg = itinerari[0].overlayImg ?? "";
let latNE = itinerari[0].latNE ?? "0";
let lngNE = itinerari[0].lngNE ?? "0";
let latSW = itinerari[0].latSW ?? "0";
let lngSW = itinerari[0].lngSW ?? "0";
}
var punti = string.deserialize(XsysPrView{fields: [ { type:'html_text', field: 'latitude' },{ type:'html_text', field: 'longitude' }],pathsearch:[p], prlist:['luogo'],output:'map',isconservative:false});
if (__request.args['ispredit']!="true") {
let punti = list.apply(punti, "$..{'marker_img':''}");
if(#marker_opt > 0)
foreach(var i in marker_opt)
let punti = list.apply(punti, "($.pageid=="..i.pageid.."+0 && $.latitude=="..i.latitude.." && $.longitude=="..i.longitude..") ? $..{'marker_img':'"..i.marker_img.."'} : $");
var urlpopup = site.uri.."/@api/deki/pages/2257/contents?dream.out.format=xml&mode=view&format=xhtml&idpunto=";
<html>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<head>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">"
var infowindow;
(function () {
google.maps.Map.prototype.markers = new Array();
google.maps.Map.prototype.addMarker = function(marker) {
this.markers[this.markers.length] = marker;
};
google.maps.Map.prototype.getMarkers = function() {
return this.markers
};
google.maps.Map.prototype.clearMarkers = function() {
if(infowindow) {
infowindow.close();
}
for(var i=0; i<this.markers.length; i++){
this.markers[i].set_map(null);
}
};
})();
var overlay;
USGSOverlay.prototype = new google.maps.OverlayView();
var map;
function initialize() {
var punti = eval('"..json.emit(punti).."');
var center = new google.maps.LatLng(eval('"..json.emit(lat+0).."'), eval('"..json.emit(lng+0).."'));
var map_zoom = eval('"..json.emit(zoom+0).."');
var stylez = newStyle();
var image = '"..markerImg.."';
var max_zoom = eval('"..json.emit(max_zoom+0).."');
var myOptions = {
zoom: map_zoom,
maxZoom: max_zoom,
center: center,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
streetViewControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}
};
map = new google.maps.Map(document.getElementById('mappa_primoLevi'), myOptions);
/*==============================================================================================*/
if('"..latNE.."' != 0 && '"..lngNE.."' != 0 && '"..latSW.."' != 0 && '"..latSW.."' != 0){
var swBound = new google.maps.LatLng("..latSW ..","..lngSW..");
var neBound = new google.maps.LatLng("..latNE..", "..lngNE ..");
var bounds = new google.maps.LatLngBounds(swBound, neBound);
var srcImage = '"..overlayImg.."';
overlay = new USGSOverlay(bounds, srcImage, map);
}
/* var swBound = new google.maps.LatLng(38.317542815465245,-2.4537309375000094);
var neBound = new google.maps.LatLng(58.94711414759125, 40.39294874999999);
var bounds = new google.maps.LatLngBounds(swBound, neBound);
var srcImage = '/@api/deki/files/756/=itinerario_prova.png';
overlay = new USGSOverlay(bounds, srcImage, map); */
/*===============================================================================================*/
if('"..mapType.."' == 'none'){
var styledMapOptions = {
map: map,
name: 'mappa_primoLevi'
}
var jayzMapType = new google.maps.StyledMapType(stylez,styledMapOptions);
map.mapTypes.set('mappa_primoLevi', jayzMapType);
map.setMapTypeId('mappa_primoLevi');
} else { map.setMapTypeId(google.maps.MapTypeId."..mapType.."); };
if(punti.length >0){
for (var i in punti){
var latlng = new google.maps.LatLng(punti[i].latitude, punti[i].longitude);
map.addMarker(createMarker(latlng, map, ((punti[i].marker_img).length>0 ? punti[i].marker_img : image), eval('"..json.emit(urlpopup).."')+punti[i].pageid));
}
}
/*google.maps.event.addDomListener(window, 'load', initialize);*/
}
/* ------------ CREA MARKER ------------- */
function createMarker(latlng, map, image, url){
infowindow = new google.maps.InfoWindow({
maxWidth: 250
});
var marker = new google.maps.Marker({
position: latlng,
map: map,
icon: image
});
/*var link_pagina = '';*/
google.maps.event.addListener(marker, 'mouseover', function() {
/* Nota: con find('div') funziona perchè div ha il metodo html, con find('body') NON funziona perchè body non ha il
metodo html - occorre impostare html ocme parametro di ritorno di jquery.get - bisogna incapsulare nella pagina wiki un
div globale, che contenga tutto, in modo che la find('div').html() restituisca il contenuto di quel div
- non è la miglior soluzione possibile ma per ora può andare
*/
jQuery.get(url, {}, function(data) {
var jData = $(data);
var jbody = jData.find('div');
var link_pagina = (jbody.find('a')).attr('href');
if(typeof(link_pagina)=='string' && link_pagina.length > 0)
google.maps.event.addListener(marker, 'click', function() {
window.location=link_pagina;
});
/*alert(link_pagina.toSource());*/
infowindow.setContent(jbody.html());
infowindow.open(map, marker);
},'html');
});
return marker;
}
/* -------------- STILE MAPPA ---------------- */
function newStyle(){
var stile = eval("..json.emit(mapStyle)..");
return stile;
}
/* -------------------- IMG Overlay -------------------------- */
function USGSOverlay(bounds, image, map) {
/* -- Now initialize all properties. */
this.bounds_ = bounds;
this.image_ = image;
this.map_ = map;
/* -- We define a property to hold the image's div. We'll
-- actually create this div upon receipt of the onAdd()
-- method so we'll leave it null for now. */
this.div_ = null;
/* -- Explicitly call setMap on this overlay */
this.setMap(map);
}
USGSOverlay.prototype.onAdd = function() {
/* -- Note: an overlay's receipt of onAdd() indicates that
-- the map's panes are now available for attaching
-- the overlay to the map via the DOM. */
/* -- Create the DIV and set some basic attributes. */
var div = document.createElement('DIV');
div.style.borderStyle = 'none';
div.style.borderWidth = '0px';
div.style.position = 'absolute';
/* -- Create an IMG element and attach it to the DIV. */
var img = document.createElement('img');
img.src = this.image_;
img.style.width = '100%';
img.style.height = '100%';
div.appendChild(img);
/* -- Set the overlay's div_ property to this DIV */
this.div_ = div;
/* -- We add an overlay to a map via one of the map's panes.
-- We'll add this overlay to the overlayImage pane.*/
var panes = this.getPanes();
panes.overlayImage.appendChild(div);
}
USGSOverlay.prototype.draw = function() {
/* -- Size and position the overlay. We use a southwest and northeast
-- position of the overlay to peg it to the correct position and size.
-- We need to retrieve the projection from this overlay to do this. */
var overlayProjection = this.getProjection();
/* -- Retrieve the southwest and northeast coordinates of this overlay
-- in latlngs and convert them to pixels coordinates.
-- We'll use these coordinates to resize the DIV. */
var sw = overlayProjection.fromLatLngToDivPixel(this.bounds_.getSouthWest());
var ne = overlayProjection.fromLatLngToDivPixel(this.bounds_.getNorthEast());
/* -- Resize the image's DIV to fit the indicated dimensions. */
var div = this.div_;
div.style.left = sw.x + 'px';
div.style.top = ne.y + 'px';
div.style.width = (ne.x - sw.x) + 'px';
div.style.height = (sw.y - ne.y) + 'px';
}
USGSOverlay.prototype.onRemove = function() {
this.div_.parentNode.removeChild(this.div_);
this.div_ = null;
}
"</script>
</head>
</html>
var style = "width:"..width.."; height:"..height;
<div id="mappa_primoLevi" style=(style)></div>
}
<script type="text/javascript">"
$(document).ready(function(){
initialize();
});
"</script>
if (user.anonymous == false) {
XsysLuogo{newpagepath:page.path};
}
Centro Internazionale di Studi Primo Levi - Tutti i diritti riservati