Locations Map

The dynamic map that displays company locations and provides useful information for organizing trips and meetings.

What is Locations Map

Our Locations Map webpart allows you to show all your companies’ locations in a world map through a map integrated with Google Maps. You can navigate through the map, see where your companies are located in a very dynamic way, and get to know company locations thanks to detailed and customizable information cards.

This component allows you to:

  • Locate your company's offices, branches, warehouses, and facilities.

  • Discover the local time, activities, and address of each facility.

  • Coordinate work with colleagues from other locations.

Please note: the component utilizes Google resources.​

Google Maps APIs offer a limited number of free calls per month, after which you switch to a paid plan. The free calls are 28,500 per month,​ and you can find the information here: https://mapsplatform.google.com/pricing/

Explore the advantages of Intranet.ai Locations Map by clicking here to learn more.


Add the Locations Map web part to a SharePoint page

  • If your page is not already in edit mode, click Edit at the top right of the page.

  • Click on it and, in the web part search box, enter Locations to quickly find and select the Locations Map web part, which is named IAI - Company Locations.

The procedure for configuring the Locations Map web part is divided into two parts: actions to be performed from the user interface and actions to be performed in a SharePoint list. The following section concerns the user interface, specifically the configuration pane of the web part.


Configuration

Setting locations

Our Locations Map component uses Google Maps, so it's necessary to have your Google account key to configure it.

The Google Maps API has a number of free calls, around 28500 per month, before upgrading to the paid plan (by credit card).

  • If you're not in edit mode already, click Edit at the top right of the page.

Here is what you can do from the user interface:

  • Enter site URL: select the Intranet site link.

  • List locations: insert the list named Company locations.

  • Enter the access key: insert the company’s Google API access key. If you don't have this key, the web part doesn't work.

Display settings

The possibility of opening the map in a specific area has recently been added, so the web part has three new properties:

  • Latitude

  • Longitude

  • Zoom level (the default value is 1)

  • Enter the latitude coordinates: you need to enter the latitude coordinates of the company location.

  • Enter the longitude coordinates: you need to enter the longitude coordinates of the company location.

  • Enter the zoom level from a value of 1 to a value of 20: with this setting, you can choose the zoom level to be applied to the map so that you can better see locations that are in a smaller area.

For example, by zooming in on Europe you can have the following view:

You can use Google Maps to get the latitude and longitude coordinates of the location you want to display at the centre of the map. Look for the exact location on Google Maps and right-click on the red pin corresponding to that position. You will see two values separated by a comma: the first value corresponds to latitude, the second one corresponds to longitude.

In the display settings, you can also choose to show a description, the local time, the company name and the company address. This information will be visible by clicking on the pin marking the position of the locations.

  • Show description: by marking the flag on this option, the description will be visible.

  • Show local time: marking the flag on this option will display the local time of the reference location.

  • Show company: by ticking the flag on this option, the company name will be visible.

  • Show address: by ticking the flag on this option, the company address will be visible.

Setting Marker Cluster

This setting is used to customize the pins corresponding to clusters of locations grouped by proximity.

  • If you're not in edit mode already, click Edit at the top right of the page.

  • Enter the link to the marker image: enter the link of the image you want to use for pins. By default, the image is the Google pin, but if you want to change it, please note that it will be the same for every cluster. The image has to be uploaded to a document library where all users have at least view access, otherwise they will not be able to see the pin. The image link should not contain special characters.

  • You can then choose the color, the size and the position of the small numbers indicating how many offices there are in a cluster. For example, if a cluster includes two locations, you will see a pin with number 2 in this part of the map. Then, if you zoom in, you will see the geographical position of these locations in detail. Here, you can change the text color, the font size and the position of these numbers to obtain a good graphic effect.


Create new locations

In order to create a new location, a few steps are required, which are listed below:

  • Access the Site contents by clicking on the Settings icon, which is located on the top right of your Intranet’s homepage.

  • Access the list named Company locations, where you need to enter the various sites you want to view one by one.

  • Click on New and a window will open with fields to be filled in.

  • Fill in the following fields. The fields marked with an asterisk (*) are mandatory:

  • Content type: select the company location list.

  • Title: enter the name of the site.

  • Company: enter the name of the company located in that site.

  • Location Type: you can enter a brief description of the site you have created (e.g., production office).

  • Country: enter the name of the country where the site is located.

  • Address: enter the address of the office.

  • Street number: enter the street number of the location.

  • Postal code: enter the postal code of the location.

  • Time zone: to get the name of the time zone, you need to access this link: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones . You will find the correct name in the TZ database name column. Write it in the Time zone box on the SharePoint list.

  • Latitude: enter the latitude of the location.

  • Longitude: enter the longitude of the location.

To get latitude and longitude coordinates, look for the exact location on Google Maps and right-click the red pin corresponding to that position. You will see two values separated by a comma: the first value corresponds to latitude, the second one corresponds to longitude.

  • Marker url: : enter the url of the picture you want to use as a pin. You can have a different pin for each location you enter (e.g., for production sites, you may insert he image of a factory). In this case, you need to insert a specific image for each location. Please, refer to the final section of this guide to learn how to create the picture url.

  • Description: enter a text to describe the company or the particular location/office you are dealing with. You can also link to a page or a website by typing the sentence you want to read and then embedding the url into the text (e.g., “Discover more”).

To insert the hyperlink in the description field, follow the steps below:

  • Click on the pencil icon to edit the description.

  • Text space: type the display text inside the text space.

  • Select the text: select all the written text.

  • Three-dot button: click on the “…” button in the top right-hand corner and then click on Add or edit hyperlink.

  • URL: insert the url of the page you want to link to.


Save the pin location preview image

The pin on the map is fully customizable and an image can be added.

To add a different preview image to the location, the image needs to be saved in the intranet. Just like the cluster image, this picture has to be uploaded to a document library where all users have at least view access, otherwise they will not be able to see the pin. The image link should not contain special characters.

In the homepage of your intranet, please click on Site contents inside the Settings section.

Once the Site contents page is open, please create a new folder by clicking on New on the top left of the page. Select Document library and give it a name, e.g., “Company-locations-images”:

Before clicking Create, remember to unflag the Show in site navigation box:

Once created, the document library will automatically open and look like this:

Here it’s possible to drag and drop the preview image.

Once the picture is uploaded to the document library, please select it, and click on the three dots icon on top of it.

The following pop-up menu will appear, then please click on View original.

A new tab will open, showing the picture; please consider this URL as the correct one to be pasted in the Marker Url field.

Then, come back to the Company locations list, select again the location, click on Edit and insert the url you’ve just created.

Now, click on Save. The pin with the personalized image is ready!

Last updated