How to add a fixed polygon layer on map

Created on 1 March 2023, over 1 year ago

I'm using this awesome module, with Views integration, to show node teasers on popups shown on OSM Mapnik map.

I need to add a perimeter polygon, as a overlay, on this map. I cannot understand where I can add it, if it is on UI, or which kind of custom module I have to implement.

I have the polygon map to overlay in this formats:

  • GML 2.0
  • GML 3.1.1
  • CSV
  • Excel
  • GeoJSON
  • Zipped Shapefile
  • Original Dataset

The map is static, it not changes based on views content.

💬 Support request
Status

Fixed

Version

10.0

Component

Documentation

Created by

🇮🇹Italy sepa_cleversoft

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @sepa_cleversoft
  • Status changed to Fixed over 1 year ago
  • 🇮🇹Italy itamair

    Not super sure I got your requirements, so I describe both the scenarios I think you could mean.

    The Leaflet Widget is able draw geometries, throughout his palettes/tools on the right of the map,
    but it is also able to manage inputs that are both in Geojson and WKT (Well Know text format).
    So, for instance, if you have a Geojson code you can simply copy and paste it in the text area below the Leaflet Widget UI
    (@see the attached screenshot)

    Otherwise, if you don't want to manage the geometries as Drupal entities, but you rather want to alter the Leaflet Map properties with geometries (and add it as Overlay) you could interact and extend the generated Leaflet Map just reacting to the 'leafletMapInit' event (generated here: https://git.drupalcode.org/project/leaflet/-/blob/10.0.x/js/leaflet.drup...) and basically then do whatever you want, if able to manage Leaflet JS library and related object.

    So for instance you could add/inject your GeoJson according to Leaflet Js documentation: https://leafletjs.com/examples/geojson/
    and more specifically with this Drupal Leaflet module applying (into your own custom module) something like the following:

    (function ($, Drupal) {
    
      'use strict';
    
      // This drives the interaction with the Geofield Leaflet Map.
      Drupal.behaviors.leafletMapInteraction = {
        attach: function (context, settings) {
    
          // React on leaflet.map event.
          $(document).on('leafletMapInit', function (e, settings, lMap, mapid, markers) {
          const map = lMap;
    
            $.getJSON("modules/custom/italo_module/geojson/nyc_subway_lines.geojson", function (data) {
                let LeafletGeoJson = L.geoJson(data);
                LeafletGeoJson.addTo(map);
              });
          });
        }
      };
    
    })(jQuery, Drupal);
  • Automatically closed - issue fixed for 2 weeks with no activity.

Production build 0.71.5 2024