summaryrefslogtreecommitdiff
path: root/www/wiki/extensions/Maps/resources/leaflet/GeoJson.js
blob: 1914738fa195df45b1879155712fc52c14719e8f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
(function() {
	'use strict';

	let GeoJson = {};

	// https://github.com/Leaflet/Leaflet/blob/f8e09f993292579a1af88261c9b461730f22e4e6/src/layer/GeoJSON.js#L49-L57
	// https://github.com/mapbox/simplestyle-spec/tree/master/1.1.0
	// https://leafletjs.com/reference-1.6.0.html#path
	GeoJson.simpleStyleToLeafletPathOptions = function(featureProperties) {
		let simpleStyleToLeaflet = {
			'stroke': 'color',
			'stroke-width': 'weight',
			'stroke-opacity': 'opacity',
			'fill': 'fillColor',
			'fill-opacity': 'fillOpacity',
		};

		let pathOptions = {};

		for (let [key, value] of Object.entries(simpleStyleToLeaflet)) {
			if (featureProperties[key]) {
				pathOptions[value] = featureProperties[key];
			}
		}

		return pathOptions;
	};

	function escapeHTML(unsafeText) {
		let div = document.createElement('div');
		div.innerText = unsafeText;
		return div.innerHTML;
	}

	GeoJson.popupContentFromProperties = function(properties) {
		if (!properties.title && !properties.description) {
			return '';
		}

		if (!properties.description) {
			return escapeHTML(properties.title);
		}

		if (!properties.title) {
			return escapeHTML(properties.description);
		}

		// CHANGE: allows html format in description of GeoJSON element
		return '<strong>' + escapeHTML(properties.title) + '</strong><br><br>'
			+ properties.description;
	};

	GeoJson.newGeoJsonLayer = function(L, json) {
		return L.geoJSON(
			json,
			{
				style: function (feature) {
					return GeoJson.simpleStyleToLeafletPathOptions(feature.properties);
				},
				onEachFeature: function (feature, layer) {
					let popupContent = GeoJson.popupContentFromProperties(feature.properties);
					if (popupContent !== '') {
						layer.bindPopup(popupContent);
					}
				}
			}
		);
	};

	if (!window.maps) {window.maps = {};}
	if (!window.maps.leaflet) {window.maps.leaflet = {};}

	window.maps.leaflet.GeoJson = GeoJson;
})();