Overview of Third Party Visualizations
If Scalar’s built-in maps and timelines do not work, you can also use maps and timelines from third-party platforms or tools such as Esri Story Maps, Neatline, Tiki-Toki, TimelineJS, and StoryMapJS within or as a supplement to your projects. These platforms and tools will allow you to layer multiple maps or timelines and work with various types of media items and prose content simultaneously. Please note that third-party content raises additional considerations for preservation and that each of these platforms have different advantages and disadvantages. The "Which Mapping Tool Is Best for You?" section of this page contains brief descriptions and considerations for some commonly used platforms.
Which Mapping Tool is Best for You?
Esri Story Maps allows you to link static and interactive maps to narrative texts, images, and multimedia content. Below are some of its advantages and challenges you might want to consider before making a selection.
Advantages
- Visually engaging interface that includes prose, media, and spatial representations of data
- A wide variety of templates for use
- Best suited for large datasets with multiple features
- Can customize maps with code
Challenges
- Annual subscription (license) to ArcGIS StoryMaps required, which costs $100-$700
- Intermediate technical skills required
- Data storage required when uploading images and video
Neatline allows you to plot and annotate artifacts (letters, photographs, paintings; any visual material) on maps as well as link particular views of those maps and thus artifacts to events in a timeline. Below are some of its advantages and challenges you might want to consider before making a selection.
Advantages
- Capable of making hand-crafted, interactive stories as interpretive expressions of a single document or a whole archival or cultural heritage collection
- Designed to be simple enough for beginners and yet flexible
Challenges
- Limited to a linear narrative, meaning that it prioritizes arguments that rely on chronological order
- Designed as a suit of plugins for the Omeka framework, it best works with Omeka.
Tiki-Toki Timeline Maker is a web-based platform which allows users to create visually striking timelines. Below are some of its advantages and challenges you might want to consider before making a selection.
Advantages
- Can link video clips, images, audio, hyperlinks, and RSS feeds
- Can customize the overall look and feel of the timeline by adding color and an image to the background as well as choosing a layout and color scheme.
- Can layer multiple timelines and categorize and color layers by theme
Challenges
- Paid account required to embed timeline into a website while users can create one Tiki-Toki timeline with free account.
- Spatial information not included
- Limited to a linear, chronological narrative
TimelineJS is an open-source Javascript and CSS based tool that allows you to create visually rich, interactive timelines, using only a Google spreadsheet. Below are some of its advantages and challenges you might want to consider before making a selection.
Advantages
- Free and easy to use
- Can link a wide variety of media including video (YouTube, Vimeo and DailyMotion), audio, images (Flickr), Google Maps, Google+ status updates and, Twitter posts.
- Several tutorials available
- Can layer events
Challenges
- Fairly limited in how much users can tweak visual design
- Required to link to media rather than upload users’ own content
StoryMaps JS is an interactive mapping and multimedia tool to help tell stories on the web that highlight the locations of a series of events. Below are some of its advantages and challenges you might want to consider before making a selection.
Advantages
- Free to use
- Can build narrative maps and large pixel images combined with other media to tell stories
- Allows users to pack information from multiple formats of media into one presentation
- Can pull in media from a variety of sources such as Twitter, Flickr, YouTube, Vimeo, Vine, Dailymotion, Google Maps, Wikipedia, SoundCloud, Document Cloud
Challenges
- Must work with already uploaded content. Cannot upload own content via Knightlabs.
- Best with stories that have strong location narrative; not suitable for narratives that need to jump around in the map
- Intermediate technical skills required when hosting files or tiles
Two Approaches of Using Third Party Maps or Timelines
There are two approaches when using third-party maps or timelines on your scalar page. The first approach is embedding third-party content into a scalar page. The second approach is using an embedded link to the third-party map or timeline as media import link. Below is a brief description of each approach’s strength and step-by-step processes.
You can use any maps and timelines from third-party platforms such as Story Map, Neatline, Tiki-Toki, TimelineJS, Google Maps, etc. in your Scalar page by embedding them through an HTML iframe tag (inline frame tag). This strategy is effective when you would like to adjust the size of your map or timeline and/or improve accessibility for screen readers.
For example, the following are the steps you need to take if you want to make your third-party map take up the majority of your page.
- In a new or existing page, click the source tab at the top of the page editor.
- Find the URL of the material you want to embed in your Scalar page.
- Paste the code below into the html editor.
<iframe src="[your url]" frameborder="0" height="650" width="100%"></iframe>
Please make sure to insert the URL you have inside the quotation marks after src=. Also be sure to include http:// at the beginning of the URL you are using. Your code should look like below.
<iframe src="an example URL" frameborder="0" height="650" width="100%" ></iframe>
A couple notes:
• Define the width of the border around the material inside the iframe. A frameborder of 0 means there is no frame. A frameborder of N (frameborder="N") will place a border N pixels wide around the material.
• Set the width and height of the map. Width can be set to pixels or percentages. The width of 100% (width=”100%”) uses the maximum width allowed inside the main content area of a Scalar page. Please refer to an example below.
- From the “Layout” drop down, select "Blank Slate and click “Save and view.”
Some third-party mapping platforms such as ArcGIS Online allows you to take their embedded link and use it as a media import link. This strategy has the benefit of treating the embedded link like other Scalar media items. You can make it a path, comment, annotation, or tag, depending on your needs.
Here is how to do it.
- In your Dashboard, choose Content. Then, filter by “Media.” Scroll down the page to find the drop-down box titled “Import Media.” Then, choose “Internet URL.”
- This will lead you to the “Import Internet Media File” page. Provide title and description appropriate to your map content. In the Media file URL, provide the embed link you took from the mapping platform.
- In the “Relationship” tab, choose path, comment, annotation, or tag as needed and click “Save and View.” (S37)
- Below is an example you can accomplish with this strategy.
