Actions

Widget

Difference between revisions of "Map"

From Dragon Eye Atlas

Line 57: Line 57:
   map.setLayoutProperty('contours-lines', 'visibility', 'none');
   map.setLayoutProperty('contours-lines', 'visibility', 'none');
<!--{/if}-->
<!--{/if}-->
   map.setLayoutProperty('overlay', 'visibility', 'visible');
   // Create a popup, but don't add it to the map yet.
  var popup = new mapboxgl.Popup({
      closeButton: false,
      closeOnClick: false
  });


  var info = "<table>";
   map.on('mousemove', 'biomes', function(e) {
   map.on('mousemove', 'biomes', function(e) {
       if (e.features.length > 0) {
       if (e.features.length > 0) {
         $("#mapinfo-biome").html(e.features[0].properties.biome);
         $("#mapinfo-biome").html(e.features[0].properties.biome);
        info = info + "<tr><td>Biome:</td><td>"+e.features[0].properties.biome+"</td></tr>";
       }
       }
   });
   });
Line 73: Line 79:
       e.features.forEach(function(feature) {
       e.features.forEach(function(feature) {
         switch (feature.properties.class) {
         switch (feature.properties.class) {
             case 'realm':    $("#mapinfo-realm").html(feature.properties.name); break;
             case 'realm':    $("#mapinfo-realm").html(feature.properties.name); info = info + "<tr><td>Realm:</td><td>"+feature.properties.name+"</td></tr>"; break;
             case 'province': $("#mapinfo-province").html(feature.properties.name); break;
             case 'province': $("#mapinfo-province").html(feature.properties.name); info = info + "<tr><td>Province:</td><td>"+feature.properties.name+"</td></tr>"; break;
             case 'culture':  $("#mapinfo-culture").html(feature.properties.name); break;
             case 'culture':  $("#mapinfo-culture").html(feature.properties.name); info = info + "<tr><td>Culture:</td><td>"+feature.properties.name+"</td></tr>"; break;
             case 'religion': $("#mapinfo-religion").html(feature.properties.name); break;
             case 'religion': $("#mapinfo-religion").html(feature.properties.name); info = info + "<tr><td>Religion:</td><td>"+feature.properties.name+"</td></tr>"; break;
         }
         }
       });
       });
      info = info + "</table>";
     
      popup.setLngLat(e.lngLat.wrap())
        .setHTML(info)
        .addTo(map);
   });
   });


Line 86: Line 97:
       $("#mapinfo-culture").html("");
       $("#mapinfo-culture").html("");
       $("#mapinfo-religion").html("");
       $("#mapinfo-religion").html("");
      popup.remove();
   });
   });



Revision as of 17:16, 11 October 2019

Map Widget

Parameters

  • lon, lat, zoom - longitude, latitude and zoom for the map (defaults: 1, 30, 4)
  • width, height - dimensions of the map itself on the page, in px or % (defaults: 50%, 400px)
  • bounds - optional bounds array, replaces lon,lat,zoom
  • show, filter = show must be one of "realm", "culture", "religion" or "province" and filter must be the (short) name of the entity to highlight

Examples

  • {{#widget:Mapbox|bounds=[[0, 25], [8, 31]]}}
  • {{#Widget:Mapbox|lat=31|lon=-15.5|zoom=3}}