https://www.vitalpilze.de/wp-content/plugins/vitalpilze//js/map.js?ver=6.9.9

1
2const iconHuman = L.icon({
3	iconUrl: VITALPILZE_PLUGIN_URL + 'images/icon-human.png',
4	iconSize: [24, 24],
5	iconAnchor: [12, 12],
6	//popupAnchor: [0, 0],
7	//shadowUrl: 'my-icon-shadow.png',
8	//shadowSize: [68, 95],
9	//shadowAnchor: [22, 94]
10});
11const iconVeterinary = L.icon({
12	iconUrl: VITALPILZE_PLUGIN_URL + 'images/icon-veterinary.png',
13	iconSize: [24, 24],
14	iconAnchor: [12, 15],
15	//popupAnchor: [0, 0],
16});
17const iconDefault = L.icon({
18	iconUrl: VITALPILZE_PLUGIN_URL + 'images/marker-icon.png',
19	iconSize: [25, 41],
20	iconAnchor: [12, 41],
21	//popupAnchor: [0, 0],
22});
23
24function vp_get_location(callback) {
25	var _geo = () => {
26		if (callback) {
27			callback({
28				coords: {
29					latitude: 0,
30					longitude: 0,
31				}
32			});
33		}
34	}
35
36	if (!navigator || !navigator.permissions || !navigator.geolocation) {
37		_geo();
38		return;
39	}
40
41	navigator.permissions.query({ name: 'geolocation' }).then((status) => {
42		if (status.state === 'granted' || status.state === 'prompt') {
43			if (navigator.geolocation.getCurrentPosition) {
44				navigator.geolocation.getCurrentPosition(callback, function (err) {
45					console.log(err);
46					_geo();
47				});
48			}
49			else _geo();
50		}
51		else {
52			_geo();
53		}
54	});
55}
56
57function vp_map(options) {
58	const defaultOptions = {
59		id: 'vp-map',
60		zoom: 5,
61		maxZoom: 19,
62		latitude: 0,
63		longitude: 0,
64	};
65	options = Object.assign({}, defaultOptions, options);
66
67	if (!options.latitude || !options.longitude) {
68		options.latitude = 50.54122;
69		options.longitude = 9.511746;
70	}
71
72	// the map
73	const map = L.map(options.id).setView([options.latitude, options.longitude], options.zoom);
74
75	// muss bezahlt werden
76	// var tiles = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
77	// 	maxZoom: 18,
78	// 	attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, ' +
79	// 		'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
80	// 	id: 'mapbox/streets-v11',
81	// 	tileSize: 512,
82	// 	zoomOffset: -1
83	// }).addTo(map);
84
85	//L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
86	//	attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
87	//}).addTo(map);
88	// L.tileLayer('http://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}', {
89	// 	maxZoom: 20,
90	// 	subdomains: ['mt0', 'mt1', 'mt2', 'mt3']
91	// }).addTo(map);
92	L.tileLayer('https://{s}.tile.osm.org/{z}/{x}/{y}.png', { attribution: 'OSM', minZoom: 2, maxZoom: options.maxZoom }).addTo(map);
93
94	// here we store all markers
95	map.markers = L.markerClusterGroup().addTo(map);
96	// map.humans = L.layerGroup().addTo(map.markers);
97	// map.veterinaries = L.layerGroup().addTo(map.markers);
98
99	return map;
100}
101
102function vp_map_random_position(map) {
103	var bounds = map.getBounds(),

104		southWest = bounds.getSouthWest(),
105		northEast = bounds.getNorthEast(),
106		lngSpan = northEast.lng - southWest.lng,
107		latSpan = northEast.lat - southWest.lat;
108
109	return new L.LatLng(
110		southWest.lat + latSpan * Math.random(),
111		southWest.lng + lngSpan * Math.random());
112}
113
114function vp_map_add_marker(map, markers = [], options = {}, callback = null) {
115	const defaultOptions = {
116		canMove: false,
117	};
118	options = Object.assign({}, defaultOptions, options);
119
120	markers.forEach(item => {
121		let icon = iconDefault;
122		if (item.type === 'human') {
123			icon = iconHuman
124		}
125		else if (item.type === 'veterinary') {
126			icon = iconVeterinary;
127		}
128
129		let layer = map.markers;
130		// if (item.type === 'human') {
131		// 	layer = map.humans;
132		// }
133		// else if (item.type === 'veterinary') {
134		// 	layer = map.veterinaries;
135		// }
136
137		let profText = '';
138		if (item.profession && item.profession.length > 0) {
139			item.profession.forEach(prof => {
140				profText += `<li class="${prof}">${prof}</li>`;
141			});
142		}
143		else {
144			profText = '<li>No profession</li>';
145		}
146
147		const text = '<ul class="vp-map-profession">' + profText + '</ul><b>' + item.name + '</b>' + item.address.replace(/\r\n|\r|\n/g, '<br/>');
148		const marker = L.marker([item.latitude, item.longitude], { icon: icon, draggable: options.canMove }).bindPopup(text).addTo(layer);
149		if (options.canMove) {
150			vp_map_marker_movable(marker, callback);
151		}
152	});
153
154	/*
155		// mit Layer
156		// https://leafletjs.com/SlavaUkraini/examples/layers-control/
157		var mrx = L.marker([39.61, -105.02]).bindPopup('Mr. X');
158		var msy = L.marker([39.74, -104.99]).bindPopup('Ms. Y');
159
160		var hp = L.layerGroup([mrx]);
161		var thp = L.layerGroup([msy]);
162
163		var layer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'});
164
165		var map = L.map('vp-map', {
166			center: [39.73, -104.99],
167			zoom: 10,
168			layers: [layer, hp, thp],
169		});
170
171		var overlayMaps = {
172			"HP": hp,
173			"THP": thp,
174		};
175
176		var layerControl = L.control.layers({}, overlayMaps).addTo(map);
177	 */
178}
179
180function vp_map_clear_markers(map) {
181	map.markers.clearLayers();
182}
183
184function vp_map_marker_movable(marker, callback) {
185	const params = {
186		latitude: 0,
187		longitude: 0,
188		marker: marker,
189	};
190
191	marker.on('dragend', function () {
192		const coord = String(marker.getLatLng()).split(',');
193		//console.log(coord);
194		params.latitude = coord[0].split('(')[1].trim();
195		//console.log(position.latitude);
196		params.longitude = coord[1].split(')')[0].trim();
197		//console.log(position.longitude);
198		//marker.bindPopup("Moved to:<br/>Latitude = " + position.latitude + "<br/>Longitude = " + position.longitude);
199		if (callback) {
200			callback(params);
201		}
202	});
203}
204
205function vp_map_find_address(map, address, canMove, callback) {
206	const _prepareAddress = (address) => {
207		address = address.replace(/\n|<br[^>]*>/g, ',');
208		address = address.replace(/<[^>]*>/g, '');
209		return address;
210	};
211
212	//var query_addr = "99 Southwark St, London SE1 0JF, UK";
213	// vp_map_find_address(map, "11, Jahnstr., 83317, Oberteisendorf, DE", true, (result) => {
214	// 	if (result.error) {

215	// 		map.setView([0, 0], 13);
216	// 		L.popup().setLatLng([0, 0]).setContent(result.error).openOn(map);
217	// 		return;
218	// 	}
219	// 	if (!result.latitude || !result.longitude) {
220	// 		map.setView([0, 0], 13);
221	// 		L.popup().setLatLng([0, 0]).setContent('Address not found!').openOn(map);
222	// 		return;
223	// 	}
224	//
225	// 	// do something with the position
226	// 	console.log(result);
227	// });
228
229	// convert address
230	address = _prepareAddress(address);
231
232	const provider = new window.GeoSearch.OpenStreetMapProvider();
233	const search = provider.search({ query: address });
234	const position = {
235		latitude: 0,
236		longitude: 0,
237	};
238
239	// clear all existing markers
240	vp_map_clear_markers(map);
241
242	// search for address
243	search.then(value => {
244		if (value.length === 0) {
245			if (callback) {
246				callback(position);
247			}
248			return;
249		}
250		for (let i = 0; i < value.length; i++) {
251			// Success!
252			position.longitude = value[i].x;
253			position.latitude = value[i].y;
254			const label = value[i].label;
255			const marker = L.marker([position.latitude, position.longitude], { draggable: canMove }).addTo(map.markers)
256			marker.bindPopup("<b>Found location</b><br>" + label);
257
258			if (canMove) {
259				vp_map_marker_movable(marker, callback);
260			}
261

262			map.setView([position.latitude, position.longitude], 16);
263
264			if (callback) {
265				callback(position);
266			}
267			break;
268		}
269	}, reason => {
270		console.log(reason); // Error!
271		if (callback) {
272			callback({ error: reason });
273		}
274	});
275}