Category Archives: About Projects

Creating a Timeline with TimelineJS and JSON

This tutorial was written by Sarah DeLorme, Associate Digital Scholarship Librarian.

The John LaFarge stained glass digital guide is a great way for users to explore the varied works of LaFarge in one accessible site. The two interactive timelines featured there help to visualize the chronology of LaFarge’s life and his work. These timelines are generated using an open-source tool called TimelineJS by Knight Lab at Northwestern University. TimelineJS can work with a Google spreadsheet to automatically create and populate a customizable timeline. This is a great option for many people, however the Digital Scholarship group was interested in hosting the timeline data locally—not pulled in via Google. In order to migrate the data, we recreated the timeline using JSON.

JSON is a format for structuring data that uses JavaScript object notation. It is used for exchanging data between a browser and server. JSON text is simple to read and work with, and is easily parsed by machines. The TimelineJS JSON format starts with a single JSON object (the timeline), and then populates it with shorter lists of objects (properties), which become the items on the timeline. The properties are events, title, era, and scale. The properties that are used will depend on the content of the timeline, and the nature of the data. The only property that is required to create a timeline is events.

Below is an example of a timeline JSON object with the title property displayed.

Each property contains its own list of properties, like a nesting doll. For both title and events properties, the items in that list are known as “Slide objects”. Slide objects include: start_date, end_date, text, and media properties. (start_date is the only slide object required to generate an event).

Each slide object then has its own list of properties for you to define, which will be where the data will be inserted. For example, the start_date slide object will have a list of “date” objects like year, month, and day. The values for these properties (the data) is entered in quotation marks, as seen in the example below.

Each property in the event object is used to customize the slides of your timeline. Aside from the start date and headline, the media property enables the embedding of images, videos, music, and more. Each event on the timeline is separated in its own set of curly brackets ({ }) within the “events” property, and separated by a comma.

Two JSON files were created for the John LaFarge stained glass digital guide, because there are two timelines featured on the site; one of LaFarge’s life, and another for the chronology of his stained glass work. The second step in this process of hosting our timeline data locally was to integrate these timelines into our website, which is hosted on Omeka. This was done by adding a few lines of JavaScript to our web page, with the help of Jesse Martinez, the Library Applications Developer.

The LaFarge site was created in the exhibit-builder module of Omeka, so the JavaScript was added to the show.php file in our theme directory, the path being: exhibit-builder/exhibits/show.php. There were three items that needed to be added to pull in our timeline: a link tag (to load the CSS), a script tag (to load the JavaScript), and an additional script tag to generate the timeline.

You will notice that since there are two separate timelines on this site, a function was added to the final script tag to identify each separate JSON file. The function decides which timeline data to pull in depending on which timeline has been identified: timeline1-embed or timeline2-embed.

Once the JavaScript was added to our file, the last step was to call the JavaScript on the pages where we wanted the timelines to appear. To do this, we navigated to the exhibit page in Omeka. We added a text box item, and then inserted this div using the HTML editor:

This told the page what to pull in, and how to style it. The div for the second page looked similar, but called in the second timeline using a different identifier:

The end result is a locally hosted, fully functional timeline.

If you are interested in further TimelineJS JSON documentation, or would like to learn how to further customize your timeline, please consult the Knight Lab’s official guide.

Representing Musicians in the SCCIM as a Network

We have made some strides since the last post where I described our initial work to represent relationships between musicians in The Séamus Connolly Collection of Irish Music (SCCIM) as linked data and a network graph. Recently, Kelly and Meg completed their work in creating links between the artists and recordings in MusicBrainz and this has resulted in a rich set of metadata. Each artist and instrument is now connected to each relevant recording.

Screenshot of Connolly data in MusicBrainz

Fig. 1 Connolly data in MusicBrainz

This results in linked records with aggregated data that shows all of the recordings a specific musician is connected to and the instrument they performed on per recording.

Screenshot of MusicBrainz data for Tina Lech

Fig. 2 MusicBrainz record for Tina Lech

Another goal of this project is to create a network graph of the musicians in the SCCIM. To visualize the relationships between each musician, I am using Gephi, an open source network visualization tool, to generate the network graphs and render them with the Sigma.js library.

A force directed layout (ForceAtlas2) was applied to render this network graph. This layout is useful for smaller graphs, such as the SCCIM network, which has 158 nodes and 224 edges. Within the network graph, the musicians are represented as nodes (dots) and relationships are edges (lines). A musician is connected to other musicians by an edge if they performed together on one or multiple tunes. The network also shows single nodes, which represent a musician who composed and/or performed the tune as a soloist. All of the data was drawn directly from the metadata in the SCCIM.

Fig. 3 Snapshot of edge data

Fig. 4 Group legend

A color is assigned to each node in order to represent groupings by role. Group 1 includes musicians who are only performers; Group 2 includes both performers/composers; and Group 3 includes only composers. Relationships are defined as a collaboration between musicians on a tune within the SCCIM collection.

Fig. 5 Sidebar view

When a node is selected, a sidebar opens up on the right with data about the musician and relationships within this network. Their name and role is listed, as is the degree (number of edges), which tells you how many collaborations this specific musician has within the context of the SCCIM. The musicians they collaborated with appear as links under “Connections.” When one of these names is clicked, the graph adjusts to show their connections. If Alice Bérubé is selected, for example, you’ll see that she collaborated with four different musicians, three of these are performers (Jeannine Webb, Pete Sutherland, and Ken Perlman), and one is a composer/performer (Seamus Connolly). Bérubé composed the tune “Don’t Get Me Anything” and also played the fiddle with Webb (fiddle), Perlman (banjo), Sutherland (piano), and Connolly (fiddle).

Fig. 6 Alice Bérubé’s connections

We focused solely on collaborations, because it was not possible to identify other types of relationships, such as who may have influenced who, who someone studied with, or band membership, because this data was not part of the original collection. In some cases, the stories written by Connolly shed some light on these additional relationships, for example, it might be mentioned that one of the musicians was a student of a certain individual or that they were influenced by a specific musician. This information might be useful to scholars and musicians interested in learning more about the way that musical traditions are transmitted, taught, and shared in the traditional Irish music community.

Visualizing the musicians who contributed compositions, performances, or both as a network graph provides a bird’s eye view at the distribution of roles. Using the “Group Selector,” you can easily see that there are 91 performers, 43 musicians who are both composers/performers, and 24 composers in this network. You can view the makeup of each group by selecting one specific group. These views depict the level of collaboration by role.

: Performers

: Performers/Composers

: Composers

A longer term goal of this project is to not only show a general list of connections for each node, but to provide further context through the use of RDF and LOD so that users will be able to see how many times a musician interacted with another musician, on which tune(s), and which instrument they played, or whether they composed the tune that was performed. This data, which will live in RDF pages, such as this example, would be dynamically generated and accessed when someone selects a musician (node). This project is ongoing and additional updates will be shared along the way. You can view the version of the interactive network graph as described in this post online.

Visualizing racial disparity in Boston, c. 1970

During the spring and summer of this year, I collaborated on an exhibit, Desegregating Boston Schools: Crisis and Community Activism, 1963-1977, with Sarah Melton and Dr. Eric Weiskott. The main exhibit is at the John J. Burns Library, and a smaller complementary exhibit is on view in the Reading Room, Level 3, Thomas P. O’Neill, Jr. Library. Curating this exhibit required doing research in special collections at John J. Burns Library, specifically in the Louise Bonar and Carol Wolfe collection, Citywide Coordinating Council Records, and the Robert F. Drinan, SJ Congressional Papers.

One aspect of this exhibit was to create visualizations and infographics using racial demographic data for the City of Boston, racial distribution of students within the Boston Public Schools, and outcomes of the Boston School Committee election of 1973. The data for these visualizations was drawn from the materials in the Bonar/Wolfe collection, Citywide Coordinating Council Records, 1970 Census, and Analyze Boston.

To complement the materials in the exhibit in the John J. Burns Library, which include a map depicting the total black population in the City of Boston (1970) juxtaposed with the wards won by the only black candidate—Patricia Bonner-Lyons, who ran for the Boston School Committee in 1973—I created these three density maps. The maps were created with tract-level 1970 Census data, which depicts the neighborhoods within the City of Boston as established by the Bureau of the Census. The shading (light to dark) of each neighborhood correlates with the number (low to high) of people according to race, as documented in the 1970 Census. From these visualizations it is easy to see that neighborhoods, including South Boston, West Roxbury, Roslindale, and Jamaica Plain were predominantly white, while the neighborhoods of Roxbury and Dorchester were predominantly black.

Density map of population by racial demographics in City of Boston, ca. 1970.

Density map depicting population according to racial demographics (white, black, and hispanic) in the City of Boston, ca. 1970. (Click on the image to open the interactive map in separate tab)

There are many different GIS platforms and tools available, but for this project I used Tableau Public a freely available software that enables you to create interactive data visualizations (not just maps!). The neighborhoods in these maps are created with a shapefile that I generated from the Neighborhood Change Database 1970-2010. Tableau Public provides the option to connect a spatial file, which will then allow you to render a spatial visualization and identify the specific dimensions (for this map: population by race) that will be shown in an info box upon clicking or hovering over the map.

Dimensions are visible in the pop-up box.

The full workbook for this visualization can be downloaded from the “City of Boston 1970 (test)” page on my Tableau Public profile page.

Exploratory Project: Connolly Linked Open Data

This past October, we launched The Séamus Connolly Collection of Irish Music, a digital collection that features over 330 traditional tunes and songs collected by master fiddle player Séamus Connolly, Sullivan Artist in Residence in Irish Music at Boston College (2004 to 2015). In addition to the wonderful music, this collection contains rich metadata, which gives us the opportunity to identify and represent relationships between the 130 or so musicians using linked open data (LOD) vocabularies and ontologies.

LOD will give people access to a wider network of information about the musicians in The Séamus Connolly Collection of Irish Music that may be available elsewhere on the semantic web through services such as DBpedia, MusicBrainz, VIAF, and elsewhere. Presenting the relationships in a dynamic network graph visualization will provide a unique way to see, explore, and access information about the musicians and relationships between musicians within this collection. The current project team is made up of Anna Kijas (Digital Scholarship), Ben Florin (Systems), Nancy Adams (eScholarship/Digital Publishing), and Kelly Webster and Meg Critch (Metadata).

One of the first steps we tackled was to identify ontologies that describe the relationships between musicians based on the stories and metadata in the collection.

Ontologies:
1. Vocab.org
Relationship type is identified using the vocab.org ontology. For example, if someone collaborates with another musician on a tune in the collection, we would identify this as rel:collaborates_with

2. The Music Ontology
To identify the composition (mo:Performance_of) on which the musicians collaborated, we are using The Music Ontology. This ontology is also being used to identify the specific instruments (mo:instrument) used in the performance by a musician.

3. FOAF
Each musician’s name is identified with foaf:name and whether they are a composer or performer using foaf:agent. Once we identified these ontologies, Nancy and Anna broke out the metadata and began identifying the relationships for each musician. In addition to the ontologies, we added columns where we could add URIs for each musician from one or multiple commonly used authority services or structured data communities: VIAF, MusicBrainz, and DBpedia.

Not every musician had a URI associated with them; therefore, we decided to create records for them in MusicBrainz (a community-maintained open source encyclopedia of music information). Kelly and Meg experimented with creating records in MusicBrainz. They started by creating an artist record and linking it to an individual recording in the Connolly Collection. They also uploaded the entire track listing of The Séamus Connolly Collection of Irish Music into MusicBrainz and are currently creating links between the artists and the recordings within MusicBrainz. Once the artist records were created in MusicBrainz Nancy added URIs to our data.

In order to make the information about each musician human and machine readable we will generate RDF pages. We currently have an example RDF page for one of the musicians – Gabriel Donahue – which illustrates the ontologies, vocabularies, and URIs referenced above in addition with schema-org vocabulary that will identify each audio track that can be accessed via SoundCloud.

Once the data review is complete we will call on Ben’s expertise to auto-generate the RDF pages for each musician, as well as to create N-Triples and network graphs visualizing the relationships. Stay tuned for more updates!

The Boston College Libraries Remember Fr. Monan

On March 18, 2017, J. Donald Monan, SJ, died, and Boston College lost its modern architect. We at Boston College grieve his loss and do our best to carry his devotion to teaching, scholarship, and building communities into a new era.

The Digital Scholarship Group has designed an exhibit in memory of Fr. Monan and his immense contributions to Boston College and beyond. We invite you to join us in remembering this extraordinary man and his life.

Header image: J. Donald Monan at a tribute to Fr. Marrow, May 1, 1996. View in BC Libraries collections.