src/assets/js/detailpage.js

   1 /*********************************************************
   2 * DETAILS PAGE
   3 *********************************************************/
   4
   5
   6
   7 function init_map_on_detail_page(lat, lon, geojson) {
   8     map = new L.map('map', {
   9         // center: [nominatim_map_init.lat, nominatim_map_init.lon],
  10         // zoom:   nominatim_map_init.zoom,
  11         attributionControl: (get_config_value('Map_Tile_Attribution') && get_config_value('Map_Tile_Attribution').length),
  12         scrollWheelZoom:    true, // !L.Browser.touch,
  13         touchZoom:          false,
  14     });
  15
  16     L.tileLayer(get_config_value('Map_Tile_URL'), {
  17         // moved to footer
  18         attribution: (get_config_value('Map_Tile_Attribution') || null ) //'&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors'
  19     }).addTo(map);
  20
  21     var layerGroup = new L.layerGroup().addTo(map);
  22
  23     var circle = L.circleMarker([lat,lon], { radius: 10, weight: 2, fillColor: '#ff7800', color: 'blue', opacity: 0.75});
  24     map.addLayer(circle);
  25
  26     if (geojson) {
  27         var geojson_layer = L.geoJson(
  28             // https://leafletjs.com/reference-1.0.3.html#path-option
  29             parse_and_normalize_geojson_string(geojson),
  30             {
  31                 style: function(feature) {
  32                     return { interactive: false, color: 'blue' };
  33                 }
  34             }
  35         );
  36         map.addLayer(geojson_layer);
  37         map.fitBounds(geojson_layer.getBounds());
  38     } else {
  39         map.setView([lat,lon],10);
  40     }
  41
  42     var osm2 = new L.TileLayer(get_config_value('Map_Tile_URL'), {minZoom: 0, maxZoom: 13, attribution: (get_config_value('Map_Tile_Attribution') || null )});
  43     var miniMap = new L.Control.MiniMap(osm2, {toggleDisplay: true}).addTo(map);
  44 }
  45
  46
  47
  48 jQuery(document).ready(function(){
  49
  50     if ( !$('#details-page').length ){ return; }
  51
  52     var search_params = new URLSearchParams(location.search);
  53     // var place_id = search_params.get('place_id');
  54
  55     var api_request_params = {
  56         place_id: search_params.get('place_id'),
  57         osmtype: search_params.get('osmtype'),
  58         osmid: search_params.get('osmid'),
  59         keywords: search_params.get('keywords'),
  60         addressdetails: 1,
  61         hierarchy: 1,
  62         group_hierarchy: 1,
  63         polygon_geojson: 1,
  64         format: 'json'
  65     };
  66
  67     fetch_from_api('details', api_request_params, function(aFeature){
  68
  69         var context = { aPlace: aFeature };
  70
  71         render_template($('main'), 'detailspage-template', context);
  72
  73         update_data_date();
  74
  75         var lat = aFeature.centroid.coordinates[1];
  76         var lon = aFeature.centroid.coordinates[0];
  77         init_map_on_detail_page(lat, lon, aFeature.geometry);
  78     });
  79 });