X-Git-Url: https://git.openstreetmap.org./nominatim-ui.git/blobdiff_plain/163775c3501257af8f62601b0bb3565133c3bebb..b63424c366297d79a9b40cb324d62b5a86bdb310:/src/components/Map.svelte diff --git a/src/components/Map.svelte b/src/components/Map.svelte index e9c4cef..dd2a1ae 100644 --- a/src/components/Map.svelte +++ b/src/components/Map.svelte @@ -6,7 +6,6 @@ import 'leaflet-minimap/dist/Control.MiniMap.min.css'; import { get } from 'svelte/store'; - import { get_config_value } from '../lib/config_reader.js'; import { map_store } from '../lib/stores.js'; import MapPosition from '../components/MapPosition.svelte'; @@ -17,24 +16,33 @@ let dataLayers = []; function createMap(container) { - const attribution = get_config_value('Map_Tile_Attribution') || null; + const attribution = Nominatim_Config.Map_Tile_Attribution; + let map = new L.map(container, { - attributionControl: (attribution && attribution.length), + attributionControl: false, scrollWheelZoom: true, // !L.Browser.touch, touchZoom: false, center: [ - get_config_value('Map_Default_Lat'), - get_config_value('Map_Default_Lon') + Nominatim_Config.Map_Default_Lat, + Nominatim_Config.Map_Default_Lon ], - zoom: get_config_value('Map_Default_Zoom') + zoom: Nominatim_Config.Map_Default_Zoom }); + if (typeof Nominatim_Config.Map_Default_Bounds !== 'undefined' + && Nominatim_Config.Map_Default_Bounds) { + map.fitBounds(Nominatim_Config.Map_Default_Bounds); + } - L.tileLayer(get_config_value('Map_Tile_URL'), { + if (attribution && attribution.length) { + L.control.attribution({ prefix: 'Leaflet' }).addTo(map); + } + + L.tileLayer(Nominatim_Config.Map_Tile_URL, { attribution: attribution }).addTo(map); if (display_minimap) { - let osm2 = new L.TileLayer(get_config_value('Map_Tile_URL'), { + let osm2 = new L.TileLayer(Nominatim_Config.Map_Tile_URL, { minZoom: 0, maxZoom: 13, attribution: attribution @@ -96,7 +104,7 @@ resetMapData(); if (position_marker) { - // We don't need a marker, but an L.circle instance changes radius once you zoom in/out + // We don't need a marker, but L.circle would change radius when you zoom in/out let cm = L.circleMarker( position_marker, { @@ -109,6 +117,7 @@ clickable: false } ); + cm.bindTooltip(`Search (${position_marker[0]},${position_marker[1]})`).openTooltip(); cm.addTo(map); dataLayers.push(cm); } @@ -127,8 +136,7 @@ }).addTo(map); } - // nothing to do - if (!aFeature) { return; } + if (!aFeature) return; let lat = aFeature.centroid ? aFeature.centroid.coordinates[1] : aFeature.lat; let lon = aFeature.centroid ? aFeature.centroid.coordinates[0] : aFeature.lon; @@ -138,6 +146,9 @@ let circle = L.circleMarker([lat, lon], { radius: 10, weight: 2, fillColor: '#ff7800', color: 'blue', opacity: 0.75 }); + if (position_marker) { // reverse result + circle.bindTooltip('Result').openTooltip(); + } map.addLayer(circle); dataLayers.push(circle); } @@ -145,7 +156,7 @@ if (geojson) { var geojson_layer = L.geoJson( - // https://leafletjs.com/reference-1.0.3.html#path-option + // https://leafletjs.com/reference-1.7.1.html#path-option parse_and_normalize_geojson_string(geojson), { style: function () { @@ -156,10 +167,10 @@ map.addLayer(geojson_layer); dataLayers.push(geojson_layer); map.fitBounds(geojson_layer.getBounds()); + } else if (lat && lon && position_marker) { + map.fitBounds([[lat, lon], position_marker], { padding: [50, 50] }); } else if (lat && lon) { map.setView([lat, lon], 10); - } else { - map.fitWorld(); } }