534N

@534N·4 public vizzes

Film Flowers, Single Complete

This visualization displays a single movie as a flower, using a radial petal diagram to encode the film's data. Each flower represents one movie, with the number of petals mapped to the movie’s IMDB vote count and the size of the petals scaled by the IMDB rating. The shape of each petal is determined by the movie's rating category (G, PG, PG-13, R). The example, titled "Film Flowers, Single Complete," renders one flower in an SVG canvas using D3 v4 and lodash, with the flower centered and scaled based on the movie's rating. The code defines petal paths for each rating category, scales for size and petal count, and draws the flower by rotating and scaling the path for each petal.

Jan 29, 2018

Loading thumbnail…

Film Flowers, Single Starter Code

This visualization shows a single movie's data rendered as an SVG flower, with each petal representing a different attribute. The starter code defines four petal path shapes and maps movie ratings (G, PG, PG-13, R) to different petal paths, while size and petal count scales are set up but not yet applied to the data. The example uses D3 v4 data-binding to append paths, and the current incomplete implementation leaves the flower undrawn, serving as a template for rendering one movie's statistics as a stylized bloom.

Jan 26, 2018

Loading thumbnail…

timeline

The timeline example displays a vertical list of years, from 2013 down to 1981, with the most recent year labeled "Now." It shows a sequence of dated entries, each linked to a map zoom level and some with geographic coordinates. The visualization uses a custom HTML template with list items, where each entry carries attributes like `zoom`, `lat`, and `lon`. The code relies on plain HTML and CSS classes for styling and interaction, with no external JavaScript libraries like D3 or Three.js evident. The data source is a Gist, and the rendering approach is a static list of clickable year labels.

Jul 18, 2013

Loading thumbnail…

JSON object

This visualization is a personal timeline that maps significant life events—such as a graduation, marriage, and job changes—to geographic coordinates in the Ottawa area. It uses a custom JavaScript object to store each year’s details, including pop-up text, timestamps, and latitude/longitude. The code dynamically renders these entries on a map, using the data structure to drive markers and interactive info windows. The implementation relies on the raw JSON-like object for data storage and DOM manipulation to display the timeline, with no external mapping libraries specified.

Jul 18, 2013