Skip to main content
SimilarExport ZIP
100%

Gist 4598f105ce3ebf702d6a5d6034562850

✓ Published0🌍 Public
DDarioCel
Last edited Jun 16, 2018
Created on Jun 16, 2018

This visualization presents the survival rates of first-class Titanic passengers using a force-directed graph. Each node represents an individual, with connections based on shared ticket numbers, and the layout is computed using D3.js’s `forceSimulation` API. The graph is rendered as a static image, likely generated by encoding node positions into a canvas via `getImageData`. The underlying data is sourced from the `titanic20160618.csv` file, which includes passenger class, survival status, and ticket details.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 121ed23ef467b1372d47e2e67d2aea1c

This example visualizes the Titanic passenger manifest, mapping each first-class passenger’s fare and age group. It uses `d3.forceSimulation` to position circles by passenger attributes, with color encoding survival status and gender. The code performs data loading via `d3.csv` and filters the dataset before rendering with SVG circles. It highlights fare disparities and demographic clusters among survivors and non-survivors, drawing directly from the provided `titanic20180616_coma.csv` file.

DDarioCel
87% match
Loading thumbnail…

titanic

This D3.js v7 visualization presents a pie chart of passenger survival outcomes from the Titanic disaster, sourced from a CSV file hosted on a GitHub Gist. The animation highlights each slice on hover using a scale transform. The code employs `d3.pie`, `d3.arc`, and `d3.rollup` to aggregate survivor counts, with an SVG renderer and a color scale distinguishing survivors (green) from non-survivors (red). The chart also includes labeled slices, a legend, and axis titles for survival status and passenger counts.

Vveeramallivaishnavi3@gmail.com
80% match
Loading thumbnail…

Fork of titanic

This fork of the Titanic dataset visualizes passenger survival status as an interactive pie chart. The code uses D3.js v7 (d3.pie, d3.arc, d3.rollup, d3.scaleOrdinal) to aggregate CSV data into two slices—Survived and Not Survived—with hover scaling effects and readable labels. Legend items and axis titles clarify the comparison, while SVG rendering and transitions provide smooth visual feedback. Data loads from a remote Gist-hosted CSV file, and the chart includes color-coded slices with animation on mouseover and mouseout.

Bboinapallyhimaja657@gmail.com
78% match
Loading thumbnail…

Tree

This example visualizes the Titanic passenger dataset as both a hierarchical tree and a force-directed network graph. The tree shows survival counts (survived vs. not survived) using d3.tree and d3.hierarchy, while the network graph uses d3.forceSimulation with d3.forceLink, d3.forceManyBody, and d3.forceCenter to position passengers. Nodes are colored by gender (blue for male, pink for female), and links connect passengers sharing the same gender, age, and passenger class. The SVG rendering, compiled from CSV data loaded via d3.csv, displays slim lightgrey links and steelblue circle nodes in the tree.

Jjammigumpula.priyanka193@gmail.com
78% match
Loading thumbnail…

Activity 6 Q2

This example visualizes survival outcomes on the Titanic by passenger class using two overlaid area charts. It loads the Titanic dataset from a CSV URL and filters the data into survived and non-survived groups, then uses `d3.rollup` to count occurrences by class. The SVG rendering employs `d3.scaleBand`, `d3.scaleLinear`, `d3.area`, and `d3.axisBottom`/`d3.axisLeft` to draw the paths, axes, and a color-coded legend.

Ssaitejakaranam10@gmail.com
78% match
Loading thumbnail…

SDA HW2-1

This pie chart visualizes the survival rates of Titanic passengers by splitting the dataset into two categories: non-survivors (0) and survivors (1). The chart uses a purple and green color scale to distinguish between the two groups, with labels showing the count for each category. Built with D3 v6, the visualization loads CSV data from a GitHub gist and uses the `d3.pie()` and `d3.arc()` functions to generate the SVG slices. A legend to the right of the chart displays the color-keyed categories, while text annotations label the axes as survival count and passenger total.

Vvits.18731a0539@gmail.com
77% match
Loading thumbnail…

Untitled

This interactive visualization presents multiple coordinated views of Titanic passenger data, including gender and survival pie charts alongside age and fare histograms. Users can filter by passenger class via dropdown, while clicking pie chart slices triggers linked selections across all views. The code uses D3.js with `d3.pie`, `d3.arc`, `d3.histogram`, and `transition.attrTween` for animated updates, rendered as SVG. Data originates from the Titanic passenger manifest, though the README references a different population dataset without visible integration.

Wwishcsdev
77% match
Loading thumbnail…

Fork of Hello VizHub

This visualization presents the survival distribution of Titanic passengers as a pie chart, using D3.js to render each passenger category as a colored slice. It shows the proportion of survivors versus casualties with interactive hover tooltips that display the count and percentage for each group, alongside a legend summarizing total counts. The chart uses d3.pie and d3.arc to generate the SVG slices, with d3.scaleOrdinal and schemeCategory10 for coloring. Data comes from a CSV dataset fetched from a GitHub gist, filtered by the "Survived" field.

Vveeramallivaishnavi3@gmail.com
77% match