Create interactive maps easily, share locations and associate structured data with areas

Description

Create interactive maps easily, share locations and associate structured data with areas.

A feature rich map application that will allow you to easily create interactive maps within XWiki. Using this application, you can present items of interest on a map in a variety of ways. Data can be associated with each item of interest so users can get more information about the item. Furthermore, using simple to advanced search and filter capabilities, users can easily look for the location they are interested in. Bundled with a lot of customization options to create the map that best suits your context.

Creation of map items

Map items are object pages that can be included in the map. There are several kind of map items namely Point, Path, Shape and Indoor Structure.

Creating a point

For creating a point that is to be included inside the map,

1. On the create page, choose Map Point as the template and create the page.
2. After clicking create, a map with several options will be shown. Select a location on the map or specify the latitude and longitude.
   
3. Specify the other properties.
4. The Options field takes CartoCSS to specify several options for Point e.g. opacity: 0.5; icon-url: "https://iconurl.com/icon.png";.
   Supported options are: icon-url, title, alt, z-index-offset, opacity, rise-offset, rise-on-hover, attribution
5. Save & View to view the newly created Point map item.

Creating a path

Paths are generated between a number of points. For creating paths, first create the points through which you want to create a path.
Now that the points are created.

1. On the create page, choose Map Path as the template and create the page.
2. On the path edit page, define the points through which you want a path.
   
3. Click Save & View.

Creating a shape

An interactive map preview with tools is provided for easily creating shapes. For creating shapes.

1. On the create page, choose Map Shape as the template and create the page.
2. On the shape edit page, a preview map will be shown with tools at the bottom left to create different shapes.
   
3. Choose any tool and create your desired shape.
4. Specify other options.
5. The Style field takes CartoCSS to specify the all the styles of shape e.g. fill-color: green;.
6. Save & View to view the newly created shape.

Creating an indoor Structure

Creating an indoor structure

A well defined text is used to gather data for an indoor structure. Levels are defined with shapes and points to be shown on each level.

The structure for levels with shapes and points should be:

For example,

Levels can be both positive and negative numbers.
When added to a map, an indoor structure will look like this with level control available at the bottom right.

Creation of a map

For including map items inside a map, map query is used to gather the map items.

Creating the map

Maps can be simply created from the map template. For creating a map,

1. Go to the space where you want to create the map and click the Create button.
2. Choose Map from the available templates and create the page.
3. A list of configurable options will appear. If you leave a field empty, its default value will be used.
   
   A detailed description of each configurable option is given at the end of this section.
4. Click Save & View to view the map.

Configurable map options

Features

This application includes a lot of customizable features which can be used to create maps of your choice.

Map editor

A complete tool is provided to easily create Point and Shape objects for the map. For using map editor,

1. Go to Maps.MapEditor.
2. Create map items using tools provided at the bottom left of the map preview.
3. Click on a map item to define its properties namely title, content, add popup and style/options, and update them. Click on delete in the properties menu to delete a map item.
4. Specify a space where map items are to be created and click Create Items and BAM!! All is done.
   

Search and filters

Search allows searching of map items or a location on the map. If search for a location is made, the map will move to that geographical location even if it is not a point of interest. Search for map item will narrow down the map items included in the map.

Filters specify solr search facets which define map item results that belong to a category.

Custom filters can be defined using the FACET FIELDS map option.

Fullscreen

A map can easily be shifted to fullscreen mode for a more dedicated and wide view.

Custom marker icon

A custom image can be used in place of the default marker icon. For using a custom image as marker icon, there are two ways.

1. Icon URL:
   • ​​​​​​​The icon-url CSS property can be defined in point's options field which takes URL of an image to be used as a marker icon. e.g. icon-url: "https://img.icons8.com/dusk/64/000000/city.png";
2. Attachment:
   • Rename your image so that it starts with the word marker. For example, marker_paris.png or markerGermany.png. Names like germanyMarker.png that do not begin with marker are not accepted.
     
   • Attach the image to the point page.

Map data importer

Large amount of map items can be imported and included in the map using the map data importer. Import map data using SPARQL from https://query.wikidata.org/ as JSON in a specific wiki space and add it to a map using map query. More details are available on the page Maps.MapDataImporter of the application.

Sample Maps

Sample maps

Prerequisites & Installation Instructions

We recommend using the Extension Manager to install this extension (Make sure that the text "Installable with the Extension Manager" is displayed at the top right location on this page to know if this extension can be installed with the Extension Manager). Note that installing Extensions when being offline is currently not supported and you'd need to use some complex manual method.

You can also use the following manual method, which is useful if this extension cannot be installed with the Extension Manager or if you're using an old version of XWiki that doesn't have the Extension Manager:

1. Log in the wiki with a user having Administration rights
2. Go to the Administration page and select the Import category
3. Follow the on-screen instructions to upload the downloaded XAR
4. Click on the uploaded XAR and follow the instructions
5. You'll also need to install all dependent Extensions that are not already installed in your wiki

Release Notes

v1.1

• INTMAP-85 Border uniformity around the demo map panel
• INTMAP-76 JavaScript instability on map at Demo.WebHome
• INTMAP-75 JSON format errors on map at Demo.WebHome
• INTMAP-74 Leaflet configuration issue on installation
• INTMAP-73 Make shape GeoJSON editable
• INTMAP-72 Webjar for leaflet-indoor, indoor template provider and other improvements
• INTMAP-71 Map Editor
• INTMAP-69 Indoor maps
• INTMAP-68 Circle shapes are shown as markers
• INTMAP-67 View map for shapes and other improvements
• INTMAP-65 Creation of a PathTemplateProvider
• INTMAP-64 Usage of terminal pages by default except for maps
• INTMAP-63 Creation of a full-fledged demo map
• INTMAP-62 PointClass: usage of doubles for latitude and longitude
• INTMAP-61 Shape and Point TemplateProviders hints improvements
• INTMAP-60 Map livetable page improvements
• INTMAP-57 PointSheet improvements in view and edit modes
• INTMAP-56 Adding "add popup to map items" option to Map class
• INTMAP-53 PointEditor: positioning the marker at the location found by the geo locator
• INTMAP-52 Ability to update a point in the point editor by dragging the marker
• INTMAP-50 Support of custom classes with custom geographical coordinates properties and content
• INTMAP-49 Support of classes with unstructured location property
• INTMAP-46 Point Editor as Point Sheet for creation and editing of points
• INTMAP-44 ShapeSheet as shape editor
• INTMAP-43 Support for shapes in map
• INTMAP-42 Support for paths in map
• INTMAP-41 Leaflet 1.5.1 upgrade
• INTMAP-40 Add configuration support for facet fields
• INTMAP-39 Demo/Museums/Code/DataImporter improvements
• INTMAP-38 Mark technical pages as hidden
• INTMAP-34 Preselect Map template when creating maps
• INTMAP-33 Remove docextra from app's homepage
• INTMAP-31 Separate advanced map options with a button
• INTMAP-26 Current location centering action improvements

v1.0

• INTMAP-28 Geolocation widget improvement
• INTMAP-25 Geolocation request error while using the current user location button
• INTMAP-23 Ability to customize the attribution control
• INTMAP-20 Improvement regarding the search button position
• INTMAP-19 Ability to configure the map size
• INTMAP-18 Ability to show / hide the map scale
• INTMAP-17 Ability to escape the full screen mode by pressing ESC
• INTMAP-16 Ability to display search, list and contextual information together
• INTMAP-15 The full screen mode is not always preserved
• INTMAP-14 Preserve map state
• INTMAP-13 Fullscreen mode
• INTMAP-12 Improve and combine search and facets
• INTMAP-11 Generalized data importer
• INTMAP-10 Add tests and prepare for first release
• INTMAP-9 Add map search results list
• INTMAP-8 Dedicated popup content area
• INTMAP-7 Theme colors in maps
• INTMAP-6 Custom marker icons have offset
• INTMAP-5 Neglect pages that are not map items
• INTMAP-4 New application architecture
• INTMAP-2 Template providers for all maps
• INTMAP-1 Filterable list maps

Dependencies

Dependencies for this extension (org.xwiki.contrib:application-interactive-maps-ui 1.1):

• org.xwiki.platform:xwiki-platform-search-solr-ui 10.11
• org.xwiki.platform:xwiki-platform-appwithinminutes-ui 10.11
• org.webjars.npm:leaflet 1.5.1
• org.webjars.npm:github-com-Leaflet-Leaflet-Editable 1.1.0
• org.webjars.bowergithub.leaflet:path.drag.js 0.0.6
• org.webjars.bowergithub.9inpachi:leaflet-indoor 1.0.0