Embracing the Art of Narrative Data Visualization | by Ahmad Albarqawi | Aug, 2023

Information Visualization by means of NASA’s TESS Mission Exoplanets

Information visualization is a robust instrument to symbolize complicated information to readers. Taking it a step additional; narrative visualization permits us to craft information tales that rework data right into a collection of compelling scenes. This strategy tailors the expertise for the viewers.

Narrative visualization is about crafting scenes that information the viewers by means of the info. It represents information in an progressive means making a story by means of it. This story emphasizes the essential factors to extend interactivity and allows the viewers to narrate to the charts. Every visible component must be rigorously woven collectively right into a significant story. Thus, this information informs the viewers whereas actively resonating with their senses. This passive information encounter permits the viewers to retain necessary data for a time period.

This text will discover the idea of narrative visualization and its makes use of in information communication. The exoplanet discoveries made by NASA’s Transiting Exoplanet Survey Satellite tv for pc (TESS) mission will function a lens by means of which we will study the narrative visuals. We may also take a look at D3, a robust JavaScript library for creating data-driven paperwork.

Narrative visualization is about making visually interesting charts, and taking your viewers on a journey to find the info. The info is briefly launched at first; it’s profoundly explored within the center and concludes with shedding gentle on the important thing insights or offering versatile exploration instruments, thus forming an interactive story.

It’s a course of that organizes information into a particular construction crafting a visible story as an alternative of randomly presenting info and figures. Due to this fact, the info turns into the characters in a narrative, and your job because the narrator is to convey these characters to life utilizing visuals. The viewers engages with the info story whereas drawing connections and recognizing patterns that may simply be retained in the long term.

There are three major constructions that narrative visualizations can take:

1. Writer-driven narratives: The creator gives a particular path by means of the info and dictates the story course, main the viewers by means of the info in a structured means. Writer-driven visuals are efficient in clearly speaking insights, resembling movies.
2. Reader-driven narratives: This strategy offers management to the viewers. It gives a extra interactive expertise the place the viewers can discover the info at their very own tempo and comply with their path. This may be efficient in encouraging engagement and exploration. An instance of that is interactive dashboards.
3. Hybrid narratives: combines components of each author-driven and reader-driven narratives. They usually begin with an author-driven introduction, adopted by a reader-driven exploration part. This gives a stability between guided storytelling and interactive exploration. An instance of that is Martini Glass information illustration.

In our upcoming sections, we are going to use the “Martini Glass” construction, a well-liked hybrid narrative, to visualise the info from NASA’s TESS mission. This construction gives an preliminary author-driven overview (the stem of the glass), adopted by a reader-driven exploration house (the bowl of the glass). Permitting us to information the viewers by means of the important thing factors of the info earlier than letting them discover the info in additional depth.

In 2018, NASA launched into an exploratory journey to find exoplanets past our photo voltaic system by launching the Transiting Exoplanet Survey Satellite tv for pc (TESS) mission.

The TESS mission has proved to be an astronomical treasure. NASA, by means of this mission, has amassed greater than 90 information factors. These factors include useful details about every exoplanet contributing to fixing a cosmic puzzle. This information contains the exoplanets’ names, their host stars and the invention yr, together with their bodily traits: dimension, form, eccentricity, and orbital interval. These datasets encapsulate every exoplanet’s story making the TESS mission’s info and figures unravel compelling cosmic tales.

We’ll use TESS data to create a story visualization that tells the story of exoplanet discoveries by means of the years with the versatile instrument on the finish for in-depth evaluation.

Scene 1: Overview of Found Exoplanet
The narrative begins with an outline of the exoplanets found by TESS from 2018 to 2023, highlighting the developments over time and evaluating some traits with Earth ranges at excessive ranges. This units the stage for our story, offering context in regards to the breadth and scope of the TESS mission. The primary scene breaks down into three particular visualizations designed to showcase a novel overview of the info:

• Histogram of Discoveries per 12 months: this showcases the variety of found exoplanets annually. The peak of every bar corresponds to the variety of discoveries. To supply an interactive expertise, clicking on the bar filter the info within the different charts for a centered evaluation of the discoveries made in that individual yr.
• Scatter Plot of Equilibrium Temperature vs Orbital Eccentricity: this scatter plot gives a view of the exoplanets’ traits by evaluating their equilibrium temperature and orbital eccentricity. The equilibrium temperature, illustrated on the x-axis, approximates the typical temperature of an exoplanet. The orbital eccentricity, displayed on the y-axis, signifies how a lot the exoplanet’s orbit deviates from an ideal circle. Interactive components allow customers to discover the info additional: hovering over a circle reveals overview of the info, whereas clicking transitions the consumer to the second scene for an in depth exploration view.
• Scatter Plot of Stellar Mass vs Radius: shifting the concentrate on the host stars, this visualization plots stellar mass in opposition to the radius, every represented by a circle. As with the earlier visualization, interactive options enable customers to discover particular planet traits.

Scene 2: In-depth Exploration of Particular person Exoplanets
Subsequent, we dive into the person exoplanets by clicking on them, exploring their distinctive traits, and evaluating these options to ranges discovered on Earth. The values are introduced utilizing a collection of horizontal bars describing a particular parameter and evaluating the exoplanet worth with an approximate corresponding Earth vary.

This scene gives a better take a look at the properties that make every planet distinctive resembling equilibrium temperature, planetary radius, orbital semi-major axis, orbital eccentricity, and the host star’s radius and mass.

Scene 3: Interactive Exploration of TESS Information
The ultimate scene gives an interactive exploration instrument that permits customers to alter numerous comparability ranges and choose which options to check. On this scene we permitting for a customized exploration expertise.

This case examine demonstrates the ability of narrative visualization in making complicated information accessible and fascinating. Within the subsequent part we are going to discover the implementation particulars.

D3.js is a javascript framework for interactive information visualizations on the internet. Earlier than we begin constructing the TESS narrative visualization, let’s discover some fundamental performance of D3.

Choosing Parts:

Certainly one of D3’s important options is the ‘choose’ methodology. This lets us determine components in an HTML doc that we have to alter. For instance:

d3.choose("#visualization")

Appending and Manipulating Parts:

D3 can assemble and handle SVG components utilizing the strategies `append`, `attr`, and `model`.

• `append` introduces new components (circles, rectangles, and many others.) into an SVG, every representing totally different information factors.
• The `attr` and `model` alter the attributes and properties of those components, like their positions, sizes, and colours.

Binding Information:

Utilizing the `information` methodology, D3 binds information to visible components. This grounds its power in creating data-driven visuals, permitting dynamic updates.

Scaling:

Scaling maps an enter area to an output vary, adjusting the drawing space on your information. For example, `d3.scaleLinear()` makes use of a linear scaling the place any given quantity within the enter area corresponds on to a quantity within the output vary.

Now that we all know the fundamentals of D3, we will construct an enticing narrative utilizing the TESS mission information (available here). For brevity, the fundamentals of the primary two scenes are mentioned intimately on this article. You’ll be able to try the GitHub Repository for complete scene implementation.

Put together the html

Load the d3 library within the header

<script src="https://d3js.org/d3.v7.min.js"></script>

Then put together a container div to attract the charts:

<div id="visualization"></div>

Scene 1: Overview of Found Exoplanets

Right here’s how we create the primary scene:

1. The TESS information is loaded and saved in a variable utilizing the `d3.csv` operate.
2. A scatter plot represents the exoplanets found by TESS over time.
3. Interactivity is added, permitting customers to click on on particular exoplanets and navigate to Scene 2.

Load the info and name the code to attract the primary scene:

d3.csv("information/tess_confirmed_plannets.csv").then(operate(myData) {
information = myData;
// Scene 1: Overview
drawScene1(myData);
});

Let’s draw a pattern from the primary scene by displaying the exoplanets in scatter plot, verify line feedback for the implementation particulars:

Scene 2: Detailed Exploration of Particular person Exoplanets

We’ll create the second scene by following these steps:

1. Create the `drawScene2` operate to make use of information from a specific exoplanet.
2. Create visible components that showcase the person options of chosen exoplanets and evaluate them with Earth’s vary.

The given code is a simplified model for Scene 1 and Scene 2. The whole code, with interactive components and options, could be sourced from the linked GitHub repository.

You’ll be able to verify the ultimate narrative end result under:

https://barqawiz.github.io/NASA_TESS_Narrative/

In conclusion, narrative visualization deviates from the monotonous information communication path and undertakes a journey. The info is introduced in a structural but interesting option to seize the viewers’s consideration. These information tales interact the viewers in an individualized method. Nevertheless, the curators of those tales can select their narrative constructions intentionally for environment friendly information storytelling, whether or not author-driven, reader-driven, or hybrid narrative.

NASA’s Transiting Exoplanet Survey Satellite tv for pc mission information was used as a case examine to display narrative visualization. This TESS mission found exoplanets past our photo voltaic system with over 90 options. The hybrid Martini Glass strategy is used to speak this information to the audiences. The narrative begins with an author-driven strategy after which transitions to particulars in regards to the exoplanets by means of a reader-driven methodology for interactive and customized exploration.

Crafting a visible narrative is an artwork the place being sure about your final aim and the audience and deciding on the construction of your story is essential to the implicit which means of your information and fascinating the audiences.

• NASA TESS mission gallery: link
• NASA exoplanet archive: link
• NASA content material coverage: link
• Earth reality sheet: link
• Github repo with the complete code: link
• The used information after cleansing: link
• UIUC course “CS 416: Information Visualization”.

Citation: NASA content material (pictures, movies, audio, and many others) is mostly not copyrighted and could also be used for instructional or informational functions without having specific permissions.