@@ Rivi 1: / Rivi 1: @@
 <includeonly>
-	<link rel="stylesheet" href="/scripts/ol3/ol.css" type="text/css">
+	<link rel="stylesheet" href="/scripts/ol-10/ol.css" type="text/css">
-    	<script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js"></script>
+	<script src="/scripts/ol-10/ol.js"></script>
-	<script src="/scripts/ol3/ol.js"></script>
+	<link rel="stylesheet" href="/scripts/ol-ext-10/dist/ol-ext.min.css" type="text/css">
+	<script src="/scripts/ol-ext-10/dist/ol-ext.min.js"></script>
 	<script src="/scripts/proj4js/dist/proj4.js"></script>
-	<link rel="stylesheet" href="https://viglino.github.io/ol-ext/dist/ol-ext.css" type="text/css">
+	<script src="/scripts/jwol10js/jwol10.js"></script>
-	<script src="https://viglino.github.io/ol-ext/dist/ol-ext.js"></script>
-	<link rel="stylesheet" href="/scripts/ol-ext/overlay/popupoverlay.css" />
-	<link rel="stylesheet" href="/scripts/ol-ext/overlay/popupoverlay.anim.css" />
-<script src="/scripts/jwol3js/jwol3.js"></script>
+	<div class="jwMapContainer" style="height:<!--{$height|default:500px|escape:'html'}-->" >
-	<div class="jwMapContainer" style="height:<!--{$height|default:500|escape:'html'}-->px" >
 		<div style="height: 100%; width: 100%; position: relative;" id="<!--{$id|default:CommonObsMap|escape:'html'}-->_container"></div>
 	</div>
 	<script type="text/javascript">
 		//global memory for widget instance
 		var <!--{$id|default:CommonObsMap|escape:'html'}-->_memo =  { 'SitesO': {}, 'TypesO': {}, 'obsTypeToShow': '' };
 		function <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() {
-	if ( typeof window.jQuery == 'undefined' ) {
+			if ( typeof window.jQuery == 'undefined' ) {
-    		setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);
+    				setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);
-  	} else {
+		  	} else {
-  		<!--{$id|default:CommonObsMap|escape:'html'}-->_func();
+		  		<!--{$id|default:CommonObsMap|escape:'html'}-->_func();
-  	}
+		  	}
-}
+		}
-setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);
+		setTimeout( function(){ <!--{$id|default:CommonObsMap|escape:'html'}-->_jQueryTest() }, 300);
 		function <!--{$id|default:CommonObsMap|escape:'html'}-->_func() {
@@ Rivi 39: / Rivi 37: @@
 			var lon = parseFloat('<!--{$lon|default:25|escape:'html'}-->');
 			var lat = parseFloat('<!--{$lat|default:65|escape:'html'}-->');
+			var zoom = parseInt('<!--{$zoom|default:4|escape:'html'}-->');
-			var zoom = jQuery('.jwZoom').first().val();
+			var page = '<!--{$page|escape:'html'}-->';
-			if (!zoom) { zoom = <!--{$zoom|default:5|escape:'html'}-->; }
+			var muni = page.replace(' (kunta)', '');
+			var base = '<!--{$base|default:mmlTausta|escape:'html'}-->';
-			var base = '<!--{$base|default:osm|escape:'html'}-->';
+			muni = 'Helsinki';
+			function gotSeaVPDs(request) {
+				var layersArr = [];
+/*
+				layersArr.push( {
+					'id': 'muni',
+					'type': 'anyrest',
+					'name': 'Kunta',
+					'restUrl': '//paikkatieto.ymparisto.fi/arcgis/rest/services/sykemaps/GISAineistot2/MapServer/0/query',
+					'search': "KuntaNimi = '" + muni + "'",
+					'selectable': false,
+					'zoomToExtent': true,
+					'bbox': false,
+					'fillColor': 'rgba( 0, 0, 0, 0 )',
+					'strokeColor': 'rgba( 200, 100, 100, 0.5 )',
+					'strokeWidth': 5
+					//'attribution': '<a href="//wwwp2.ymparisto.fi/kayttoehdot.html">Ympäristöhallinnon paikkatietoaineistot</a>',
+				});
+*/
+console.log( muniNameToNumber( muni ) );
-			//var lon = jQuery('.jwLon').first().val().replace(',', ',');
+				layersArr.push( {
-			//var lat = jQuery('.jwLat').first().val().replace(',', ',');
+					'id': 'muni',
-			var parent = jQuery('.jwParent').first().val();
+					'type': 'anygeo',
+					'name': 'Kunta',
-			parent='Välijärvi (74.021.1.051)';
+					'restUrl': '//inspire-wfs.maanmittauslaitos.fi/inspire-wfs/au',
-			var newSite = true;
+					'layer': 'au:AdministrativeUnit',
+					//'search': "KuntaNimi = '" + muni + "'",
-			function gotCoords(request) {
+					//'cql_filter': 'nationalCode=' + muniNameToNumber( 'Pornainen' ),
+                                        'cql_filter': "nationalCode='" + muniNameToNumber( muni ) + "'",
-				//console.log(request);
+					'selectable': false,
+					'zoomToExtent': true,
-				var layersArr = [];
+					'bbox': false,
+					'fillColor': 'rgba( 0, 0, 0, 0 )',
-				for (var r in request.query.results) {
+					'strokeColor': 'rgba( 200, 100, 100, 0.5 )',
+					'strokeWidth': 5
-					var body = request.query.results[r];
+					//'attribution': '<a href="//wwwp2.ymparisto.fi/kayttoehdot.html">Ympäristöhallinnon paikkatietoaineistot</a>',
+				});
-					if (typeof body.printouts['Järvinumero'][0] != 'undefined') {
-						layersArr.push(	{
-							'type': 'lake',
-							'name': body.fulltext,
-							'search': "JarviTunnus = '" + body.printouts['Järvinumero'][0] + "'",
-							'opacitySlider': true,
-							'showLabels': false,
-							'selectable': false,
-							'zoomToExtent': newSite
-						} );
-						layersArr.push( {
-							'type': 'sitesNobses',
-							'name': 'Paikat ja havainnot',
-							'siteSearch': '[[Alue::' + parent + ']]',
-							'obsSearch': '',
-							//'obsDays': 10,
-							//'attribution': 'Havainnot: Järvi-meriwiki',
-							'opacitySlider': false,
-							'selectable': true,
-							'zoomToExtent': false
-						});
-					} else if (typeof body.printouts['Vesistöaluenumero'][0] != 'undefined') {
-						layersArr.push(	{
-							'type': 'drainage',
-							'name': body.fulltext,
-							'search': "Jako3Tunnus = '" + body.printouts['Vesistöaluenumero'][0] + "'",
-							'opacitySlider': true,
-							'showLabels': false,
-							'selectable': false,
-							'zoomToExtent': newSite
-						} );
-					} else if (typeof body.printouts['VPDTunnus'][0] != 'undefined') {
-						layersArr.push(	{
-							'type': 'vpd',
-							'name': body.fulltext,
-							'search': "VPDTunnus = '" + body.printouts['VPDTunnus'][0] + "'",
-							'opacitySlider': true,
-							'showLabels': false,
-							'selectable': false,
-							'zoomToExtent': newSite
-						} );
-					}
-					break;
-				}
-				layersArr.push( { 'type': 'geolocX', 'name': 'Sijaintisi', 'show': true, 'center': true, 'zoom': 18, 'track': false, 'button': true } );
 				// do the base map with these settings
-				var map = ol3_jwMakeMap({
+				var map = jwMakeMap({
 					'container': '<!--{$id|default:CommonObsMap|escape:'html'}-->_container',
 					'base': base,
@@ Rivi 119: / Rivi 89: @@
 					'lat': lat,
 					'zoom': zoom,
+					'geolocation': true,
 					'layers': layersArr,
 					'memo': memo
 				});
-				target = new ol.control.Target();
-				map.addControl(target);
-				// set mousewheelzoom not to change center
-				var mouseZoom = new ol.interaction.MouseWheelZoom( { useAnchor: false } );
- 				map.addInteraction(mouseZoom);
- 				var drawSource = new ol.source.Vector();
-				var drawLayer = new ol.layer.Vector({
-					name: 'Alue',
-					source: drawSource
-				});
-				map.addLayer(drawLayer);
-				// Edit control bar
-				var editbar = new ol.control.Bar({
-					toggleOne: true,
-					//group: true
-				});
-				map.addControl(editbar);
-				var selectCtrl = new ol.control.Toggle({
-					html: '<i class="fa fa-hand-pointer-o"></i>',
-					title: "Select",
-					interaction: new ol.interaction.Select (),
-					//bar: sbar,
-					autoActivate:true,
-					active:true
-				});
-				// Add editing tools
-				var pedit = new ol.control.Toggle({
-					html: '<img src="//www.jarviwiki.fi/dynpm/ol/jw_ol_drawPoint_24px.png">', //'<i class="fa fa-map-marker" ></i>',
-					title: 'Point',
-					interaction: new ol.interaction.Draw({
-						type: 'Point',
-						source: drawSource
-					})
-				});
-				var ledit = new ol.control.Toggle({
-					html: '<i class="fa fa-share-alt" ></i>',
-					title: 'LineString',
-					interaction: new ol.interaction.Draw({
-						type: 'LineString',
-						source: drawSource,
-						// Count inserted points
-						geometryFunction: function(coordinates, geometry) {
-							if (geometry) geometry.setCoordinates(coordinates);
-							else geometry = new ol.geom.LineString(coordinates);
-							this.nbpts = geometry.getCoordinates().length;
-console.log('dddd');
-							return geometry;
-						}
-					}),
-				});
-				var fedit = new ol.control.Toggle({
-					html: '<img src="//www.jarviwiki.fi/dynpm/ol/jw_ol_drawPolygon_24px.png">', //'<i class="fa fa-bookmark-o fa-rotate-270" ></i>',
-					title: 'Polygon',
-					interaction: new ol.interaction.Draw({
-						type: 'Polygon',
-						source: drawSource,
-						// Count inserted points
-						geometryFunction: function(coordinates, geometry) {
-							this.nbpts = coordinates[0].length;
-							if (geometry) geometry.setCoordinates([coordinates[0].concat([coordinates[0][0]])]);
-							else geometry = new ol.geom.Polygon(coordinates);
-							return geometry;
-						}
-					}),
-				});
-				 				var drawSelect = new ol.interaction.Select();
-  				map.addInteraction(drawSelect);
-				var medit = new ol.control.Toggle({
-					html: '<img src="//www.jarviwiki.fi/dynpm/ol/jw_ol_drawEdit_24px.png">', //'<i class="fa fa-bookmark-o fa-rotate-270" ></i>',
-					title: 'Edit',
-					interaction: new ol.interaction.Modify({
-						features: drawSelect.getFeatures(),
-						//type: 'Polygon',
-						source: drawSource,
-						// Count inserted points
-						//geometryFunction: function(coordinates, geometry) {
-						//	this.nbpts = coordinates[0].length;
-						//	if (geometry) geometry.setCoordinates([coordinates[0].concat([coordinates[0][0]])]);
-						//	else geometry = new ol.geom.Polygon(coordinates);
-						//	return geometry;
-						//}
-					}),
-				});
-				editbar.addControl ( selectCtrl );
-				editbar.addControl ( pedit );
-				editbar.addControl ( ledit );
-				editbar.addControl ( fedit );
-				editbar.addControl ( medit );
-				jQuery('#jwChosenObsTypeContainer').html('Siirrä ja zoomaa karttaa kunnes risti osoittaa tarkoittamaasi paikkaan');
-				map.on('moveend', function() {
-					var centerLonLat = (ol.proj.transform(map.getView().getCenter(), 'EPSG:3857', 'EPSG:4326'));
-					jQuery('.jwLon').val(centerLonLat[0]);
-					jQuery('.jwLat').val(centerLonLat[1]);
-					jQuery('.jwZoom').val(map.getView().getZoom());
-				});
-				map.getLayers().item(0).on('change', function(e) {
-					var baseLayers = e.target.getLayers(); // map.getLayerGroup().getLayers().item(0).getLayers();
-					baseLayers.forEach(function (layer) {
-						if (layer.get('visible') == true) {
-							var title = (layer.get('title'));
-							if (title == 'MML Taustakartta') {
-								jQuery('.jwBase').val('MMLTausta');
-							} else if (title == 'MML Ortokuva') {
-								jQuery('.jwBase').val('MMLOrto');
-							} else {
-								jQuery('.jwBase').val('osm');
-							}
-							//console.log(title);
-						}
-					});
-				});
-			}
-			if (!!parent) {
-				var searchStr = 'action=ask&query=[[' + parent + ']]';
-				searchStr += encodeURI('|?KoordPohj|?KoordIta|?KoordPohjMin|?KoordItaMin|?KoordPohjMax|?KoordItaMax|?Zoom|?Järvinumero|?VPDTunnus|?Vesistö|?Vesistöaluenumero|?Luokka');
-				searchStr += '&format=json';
-				jQuery.ajax({
-					type: 'POST',
-					url: queryApi,
-					data: searchStr,
-					success: gotCoords,
-					dataType: 'jsonp',
-					cache: true
-				});
-			} else {
 			}
+			var searchStr = 'action=ask&query=[[Luokka:Merialue]][[Kunta::' + page + ']]';
+			searchStr += encodeURI('|?VPDTunnus');
+			searchStr += '&format=json';
+			jQuery.ajax({
+				type: 'GET',
+				url: queryApi,
+				data: searchStr,
+				success: gotSeaVPDs,
+				dataType: 'jsonp',
+			       	cache: true
+			});
 		}
 	</script>
 </includeonly>

Widget:Ol10TestMap

Nykyinen versio 4. helmikuuta 2026 kello 08.58