kopia lustrzana https://github.com/openstreetmap-polska/aed-mapa
Porównaj commity
7 Commity
8be72ad511
...
8fd8a14ca0
| Autor | SHA1 | Data |
|---|---|---|
Maciej
|
8fd8a14ca0 | |
|
Maciej
|
f71e961955 | |
|
Maciej
|
121e5782ae | |
|
Maciej
|
eb284c3476 | |
|
Maciej
|
acbd05d90c | |
|
Maciej
|
0e4fd8b719 | |
|
ANCMN
|
623df0bc0a |
|
|
@ -569,10 +569,9 @@
|
|||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<script src="./src/other-ui-stuff.js"></script>
|
||||
<script src="./src/style/layers.js"></script>
|
||||
<script src="./src/map.js"></script>
|
||||
<script src="./src/osm-integration.js"></script>
|
||||
<script src="./src/pwa-EventListeners.js" type="module"></script>
|
||||
|
|
|
|||
148
src/map.js
148
src/map.js
|
|
@ -1,5 +1,3 @@
|
|||
const aedSource = './aed_poland.geojson';
|
||||
const customLayerSource = './custom_layer.geojson';
|
||||
const aedMetadata = './aed_poland_metadata.json';
|
||||
const controlsLocation = 'bottom-right';
|
||||
let aedNumberElements = [
|
||||
|
|
@ -10,82 +8,18 @@ let aedNumberComment = document.getElementById('aed-number-comment');
|
|||
|
||||
let fetchMetadata = fetch(aedMetadata);
|
||||
|
||||
var map = new maplibregl.Map({
|
||||
'container': 'map', // container id
|
||||
'center': [20, 52], // starting position [lng, lat]
|
||||
'maxZoom': 19, // max zoom to allow
|
||||
'zoom': 6, // starting zoom
|
||||
'hash': 'map',
|
||||
'maxPitch': 0,
|
||||
'dragRotate': false,
|
||||
'preserveDrawingBuffer': true,
|
||||
'style': {
|
||||
'version': 8,
|
||||
"glyphs": "https://fonts.openmaptiles.org/{fontstack}/{range}.pbf",
|
||||
'sources': {
|
||||
'raster-tiles': {
|
||||
'type': 'raster',
|
||||
'tiles': [
|
||||
'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
'https://b.tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||||
'https://c.tile.openstreetmap.org/{z}/{x}/{y}.png'
|
||||
],
|
||||
'tileSize': 256,
|
||||
'maxzoom': 19,
|
||||
'paint': {
|
||||
'raster-fade-duration': 100
|
||||
}
|
||||
//'attribution': `<span id="refresh-time"></span>dane © <a target="_top" rel="noopener" href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors.`,
|
||||
},
|
||||
'aed-locations': {
|
||||
'type': 'geojson',
|
||||
'data': aedSource,
|
||||
'cluster': true,
|
||||
'clusterRadius': 32,
|
||||
'maxzoom': 12,
|
||||
},
|
||||
'custom-source': {
|
||||
'type': 'geojson',
|
||||
'data': customLayerSource,
|
||||
'cluster': false,
|
||||
'maxzoom': 12,
|
||||
},
|
||||
},
|
||||
'layers': [{
|
||||
'id': 'background',
|
||||
'type': 'raster',
|
||||
'source': 'raster-tiles',
|
||||
'minZoom': 0,
|
||||
'maxZoom': 19,
|
||||
}, {
|
||||
'id': 'clustered-circle',
|
||||
'type': 'circle',
|
||||
'source': 'aed-locations',
|
||||
'paint': {
|
||||
'circle-color': 'rgba(0,145,64, 0.85)',
|
||||
'circle-radius': 20,
|
||||
'circle-stroke-color': 'rgba(245, 245, 245, 0.88)',
|
||||
'circle-stroke-width': 3,
|
||||
},
|
||||
'filter': ['has', 'point_count'],
|
||||
}, {
|
||||
'id': 'clustered-label',
|
||||
'type': 'symbol',
|
||||
'source': 'aed-locations',
|
||||
'layout': {
|
||||
'text-field': '{point_count_abbreviated}',
|
||||
'text-font': ['Open Sans Bold'],
|
||||
'text-size': 14,
|
||||
'text-letter-spacing': 0.05,
|
||||
'text-overlap': 'always',
|
||||
},
|
||||
'paint': {
|
||||
'text-color': '#f5f5f5',
|
||||
},
|
||||
'filter': ['has', 'point_count'],
|
||||
}, ],
|
||||
},
|
||||
});
|
||||
const map = new maplibregl.Map({
|
||||
"container": "map",
|
||||
"style": layers
|
||||
});
|
||||
|
||||
map.loadImage('./src/img/marker-image-yes.png', (error, image) => {
|
||||
if (error) throw error;
|
||||
|
||||
map.addImage('aed-icon-yes', image, {
|
||||
'sdf': false
|
||||
});
|
||||
});
|
||||
|
||||
//map.scrollZoom.setWheelZoomRate(1 / 100);
|
||||
map.scrollZoom.setWheelZoomRate(1);
|
||||
|
|
@ -154,51 +88,6 @@ map.addControl(
|
|||
|
||||
console.log('Loading icon...');
|
||||
|
||||
map.loadImage('./src/img/marker-image-yes.png', (error, image) => {
|
||||
if (error) throw error;
|
||||
|
||||
map.addImage('aed-icon-yes', image, {
|
||||
'sdf': false
|
||||
});
|
||||
});
|
||||
|
||||
map.loadImage('./src/img/marker-image-private.png', (error, image) => {
|
||||
if (error) throw error;
|
||||
|
||||
map.addImage('aed-icon-private', image, {
|
||||
'sdf': false
|
||||
});
|
||||
});
|
||||
|
||||
map.loadImage('./src/img/marker-image-customers.png', (error, image) => {
|
||||
if (error) throw error;
|
||||
|
||||
map.addImage('aed-icon-customers', image, {
|
||||
'sdf': false
|
||||
});
|
||||
map.addImage('aed-icon-permit', image, {
|
||||
'sdf': false
|
||||
});
|
||||
map.addImage('aed-icon-permissive', image, {
|
||||
'sdf': false
|
||||
});
|
||||
map.addImage('aed-icon-emergency', image, {
|
||||
'sdf': false
|
||||
});
|
||||
});
|
||||
|
||||
map.loadImage('./src/img/marker-image-no.png', (error, image) => {
|
||||
if (error) throw error;
|
||||
|
||||
map.addImage('aed-icon-no', image, {
|
||||
'sdf': false
|
||||
});
|
||||
|
||||
map.addImage('aed-icon-', image, {
|
||||
'sdf': false
|
||||
});
|
||||
});
|
||||
|
||||
map.on('mouseenter', 'clustered-circle', () => {
|
||||
map.getCanvas().style.cursor = 'pointer';
|
||||
});
|
||||
|
|
@ -243,19 +132,6 @@ map.on('load', (e) => {
|
|||
refreshTime.innerHTML = `Ostatnia aktualizacja danych OSM: <span class="has-text-grey-dark" title="${refreshTimeValueLocale}">${dateDiffMinutes} minut temu </span>`;
|
||||
});
|
||||
|
||||
console.log('Adding layers...');
|
||||
map.addLayer({
|
||||
'id': 'unclustered',
|
||||
'type': 'symbol',
|
||||
'source': 'aed-locations',
|
||||
'layout': {
|
||||
'icon-image': 'aed-icon-yes', //['concat', 'aed-icon-', ['get', 'access']],
|
||||
'icon-size': 1,
|
||||
'icon-overlap': 'always',
|
||||
},
|
||||
'filter': ['!', ['has', 'point_count']],
|
||||
});
|
||||
|
||||
map.on('click', 'unclustered', function (e) {
|
||||
if (e.features[0].properties !== undefined) {
|
||||
let properties = {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
{
|
||||
"aed-customers": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"aed-default": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 240,
|
||||
"y": 0
|
||||
},
|
||||
"aed-no": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 0,
|
||||
"y": 240
|
||||
},
|
||||
"aed-private": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 240,
|
||||
"y": 240
|
||||
}
|
||||
}
|
||||
Plik binarny nie jest wyświetlany.
|
Po Szerokość: | Wysokość: | Rozmiar: 7.3 KiB |
|
|
@ -0,0 +1,30 @@
|
|||
{
|
||||
"aed-customers": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"aed-default": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 240,
|
||||
"y": 0
|
||||
},
|
||||
"aed-no": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 0,
|
||||
"y": 240
|
||||
},
|
||||
"aed-private": {
|
||||
"height": 240,
|
||||
"pixelRatio": 1,
|
||||
"width": 240,
|
||||
"x": 240,
|
||||
"y": 240
|
||||
}
|
||||
}
|
||||
Plik binarny nie jest wyświetlany.
|
Po Szerokość: | Wysokość: | Rozmiar: 7.3 KiB |
|
|
@ -0,0 +1,77 @@
|
|||
let layers = {
|
||||
"version": 8,
|
||||
"metadata": {"maputnik:renderer": "mbgljs"},
|
||||
"center": [20, 52],
|
||||
"zoom": 6,
|
||||
"sources": {
|
||||
"raster-tiles": {
|
||||
"type": "raster",
|
||||
"tiles": [
|
||||
"https://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
|
||||
"https://b.tile.openstreetmap.org/{z}/{x}/{y}.png",
|
||||
"https://c.tile.openstreetmap.org/{z}/{x}/{y}.png"
|
||||
],
|
||||
"tileSize": 256,
|
||||
"maxzoom": 19,
|
||||
"paint": {"raster-fade-duration": 100},
|
||||
"attribution": "data © <a target=\"_top\" rel=\"noopener\" href=\"https://www.openstreetmap.org/copyright\">OpenStreetMap</a> contributors."
|
||||
},
|
||||
"aed-locations": {
|
||||
"type": "geojson",
|
||||
"data": "../../aed_poland.geojson",
|
||||
"cluster": true,
|
||||
"clusterRadius": 32,
|
||||
"maxzoom": 12
|
||||
}
|
||||
},
|
||||
"glyphs": "https://fonts.openmaptiles.org/{fontstack}/{range}.pbf",
|
||||
"sprite": "https://aed.openstreetmap.org.pl/dev/src/sprites/aed-style",
|
||||
"layers": [
|
||||
{
|
||||
"id": "background",
|
||||
"type": "raster",
|
||||
"source": "raster-tiles",
|
||||
"minZoom": 0,
|
||||
"maxZoom": 19
|
||||
},
|
||||
{
|
||||
"id": "unclustered",
|
||||
"type": "symbol",
|
||||
"source": "aed-locations",
|
||||
"filter": ["!", ["has", "point_count"]],
|
||||
"layout": {"icon-image": "aed-default", "icon-size": 0.36}
|
||||
},
|
||||
{
|
||||
"id": "clustered-circle",
|
||||
"type": "circle",
|
||||
"source": "aed-locations",
|
||||
"filter": ["has", "point_count"],
|
||||
"paint": {
|
||||
"circle-color": "rgba(0,145,64, 0.85)",
|
||||
"circle-radius": 20,
|
||||
"circle-stroke-color": "rgba(245, 245, 245, 0.88)",
|
||||
"circle-stroke-width": 3
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "clustered-label",
|
||||
"type": "symbol",
|
||||
"source": "aed-locations",
|
||||
"filter": ["has", "point_count"],
|
||||
"layout": {
|
||||
"text-field": "{point_count_abbreviated}",
|
||||
"text-font": ["Open Sans Bold"],
|
||||
"text-size": 14,
|
||||
"text-letter-spacing": 0.05
|
||||
},
|
||||
"paint": {"text-color": "#f5f5f5"}
|
||||
}
|
||||
],
|
||||
"container": "map",
|
||||
"maxZoom": 19,
|
||||
"hash": "map",
|
||||
"maxPitch": 0,
|
||||
"dragRotate": false,
|
||||
"preserveDrawingBuffer": true,
|
||||
"id": "53fam6b4c"
|
||||
};
|
||||
Ładowanie…
Reference in New Issue