Skip to main content
Skip table of contents

12. Geospatial Mapping and Tagging

In this Session…

Before you begin…

  • Using the Map panel to display graph data on a world map.

  • Tagging nodes.

  • Selecting a Map Server.

To follow along, download the files: https://kineviz.com/s/GXR_QSG.zip


Slide

1

How To GraphXR 12. Geospatial Mapping and Tagging

2

Before You Begin…

Ideally, you’ll have worked through Module 11. Editing. If you’re starting here, and you want to follow along, you’ll need to:

  • Log in to GraphXR , create a Project, and open its graph space.

  • Download https://kineviz.com/s/GXR_QSG.zip, which contains the Game of Thrones data we’re using in this tutorial series.

3

Game of Thrones represents a fictional world, but we can map locations where it was filmed. Open the Map panel to display a default world map (powered by Mapbox). 

4

From your data, drag and drop the Locations.kml file onto the project space. Keyhole Markup Language (.kml) and Keyhole Markup Zip (.kmz) files are used by mapping applications such as Google Earth. They include latitude and longitude coordinates, so we can display nodes for each location on a world map in GraphXR.

5

A node is created for each filming location. The nodes receive a default category name (kmzImportPoint) and are dropped onto the map. The map boundaries are automatically re-set to display just the locations present in the data.

6

Open the Table panel to review the locations and their latitude / longitude properties.

7

The category name isn’t very descriptive, so let’s click to open an Enhanced Table and re-name the category to Location. Close the table and return to the map.

8

The Search Location bar lets you search for locations by place name. Click a location name to center the map on it.

9

By default, map boundaries are auto-fitted to the data when you close and re-open the map panel. To have your map boundaries persist, click the map Settings button and de-select the Auto Fitting checkbox.

10

Click the Map Control toggle to set map boundaries. Pan the map with left click drag and zoom with mouse scroll. While in Map Control mode, 3D navigation is disabled.

11

Now click to deactivate Map Control to return to 3D navigation. You still zoom using mouse scroll, but now left click drag rotates and tilts the map in three dimensions.

12

Now let’s group our locations by hotter or cooler climate. We’ll use the Tag function to tag groups of nodes regardless of their existing category. Select nodes toward the south and click the Tag toolbar icon (or right-click and choose Actions=>Tag.)

13

In the Manager Tags dialog, enter a tag label (Warmer) and click Add Tag.

14

We’ve now created a tag called “Warmer” containing 37 nodes. A badge appears on each tagged node. If we want to remove the tag, we could click Clean Node Tags, but let’s create a few more tags instead.

15

Select mid-latitude nodes in the UK, click the Tag icon and add a ”Cooler” tag. Go back to the graph and select nodes in Iceland and add a “Cold” tag.
Optionally, click Save Tags as Property to add a _graphxrtags property to all tagged nodes.

16

The tag label (e.g. Warmer, Cooler, or Cold) is entered as the _graphxrtags property value. If you give a node more than one tag, the tag labels are separated by colons.

17

So far nothing visibly changed in the graph. Let’s switch to Tag mode in the Legend. Now nodes for our three tags are given separate colors.

18

Click a tag label to select all nodes with that tag.
Click the dot next to the tag label to choose a different tag color or set a tag icon.

19

We’ve used the default Mapbox map server so far. In the Map panel, click Settings to choose a different available Map Server such as Google or OpenStreetMaps.

20

The map changes immediately when you select a different map server.

21

When you click Hide Map, the nodes, which were pinned to the 3D map, are released and returned to a Force layout. Click Show Map to drop the nodes back on the map.

22

So far, we’ve brought in data from tabular CSV or KML files, or from GraphXR’s saved data views. Next, in Module 13. Querying, we’ll pull in data from a connected Neo4j graph database.

Next Steps…

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.