Skip to main content
SimilarExport ZIP
100%

Activity6-question3

✓ Published0🌍 Public
Mmeenam1106@gmail.com
Last edited Apr 4, 2024
Created on Apr 4, 2024
Forked from Hello VizHub

This interactive scatter plot visualizes the Titanic dataset, showing the relationship between passenger fare and age as individual steelblue circles. The visualization uses D3 v6 with an SVG rendering approach, employing `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to map the data. Data is loaded via `d3.csv` from a GitHub-hosted CSV file, with the chart sized to the full browser window and axes labeled "Age" and "Fare". The plot provides a straightforward view of fare versus age distribution across all passengers.

AI-generated description

We are Displaying the TITANIC dataset using Scatter plot.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6 Q2

An area chart displays the relationship between passenger age and fare from the Titanic dataset. The D3 v7 library loads the CSV data, maps age to the x-axis and fare to the y-axis, and renders a steel-blue filled area using `d3.area`. Linear scales, axes with labels, and a responsive SVG container structure the visualization.

Ssaitejakaranam10@gmail.com
89% match
Loading thumbnail…

Ice6_question2

This scatter plot visualizes the relationship between passenger age and fare price in the Titanic dataset, with each circle representing a passenger and colored by survival status (green for survived, red for did not survive). The visualization uses D3.js v7 with SVG rendering, loading data asynchronously via `d3.csv` from the public Titanic dataset on GitHub. D3 scales (`d3.scaleLinear` for axes and `d3.scaleOrdinal` for colors) map data values to pixel positions, while `d3.axisBottom` and `d3.axisLeft` generate the axes. Hover effects increase point opacity, and a legend distinguishes survival outcomes.

Ssrujana reddy
88% match
Loading thumbnail…

question 6

A scatter plot displays Titanic passengers, mapping Fare on the x-axis and Age on the y-axis. Each passenger is represented by a star or diamond symbol, colored red for non-survivors and green for survivors, using the D3.js library with SVG rendering. The chart loads data from a CSV file via `d3.csv`, processes missing values, and uses `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` for axes. Custom D3 symbols and a survival-based color scale reveal the relationship between fare, age, and survival outcome.

Vvinaykollapudi@my.unt.edu
88% match
Loading thumbnail…

reusable scatter plot

This reusable scatter plot visualizes the relationship between passenger age and fare from the Titanic dataset, colored by gender. Built with D3.js v6, it uses an SVG-based rendering approach with scales that adapt to the data domain. The x-axis represents age in years, the y-axis displays fare in dollars, and each circle is colored according to the passenger's gender using a categorical color scale. The code follows a modular, reusable function pattern, allowing the chart to be easily configured with different dimensions, data, and accessor functions. Axis labels clearly identify the variables, and the plot updates dynamically based on the data provided.

Vvishnupriya eupuri
87% match
Loading thumbnail…

task3

This scatter plot visualizes the Titanic dataset, plotting passenger age against survival status (0 or 1) with steelblue circles. The code uses D3 v6 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load the data, map the values, and render the axes in an SVG. Data is fetched from a remote gist URL, and the visualization fills the full browser window with labeled axes for Age and Survived.

Kkeerthanachinthalapally@gmail.com
86% match
Loading thumbnail…

Qualitative Scatter Plot in D3

This qualitative scatter plot displays the relationship between passenger age, fare paid, and survival status for 887 Titanic passengers. Each circle represents a passenger, with blue and red indicating survival (1) or non-survival (0), using a color scale from D3’s ordinal scale. The visualization uses D3 v7 to load CSV data from a remote source and render SVG circles, axes, and a legend. The code specifically employs `d3.csv`, `d3.scaleLinear` for the x (age) and y (fare) axes, and `d3.legendColor` to create the categorical legend, with the chart positioned within an SVG container using custom margins.

EEunice Tu
86% match
Loading thumbnail…

area chart

This area chart visualizes the relationship between passenger age and fare from a Titanic dataset, using a subset of eight data points. The chart employs D3.js v7 to create an SVG-based area graph, with age on the x-axis and fare on the y-axis. The area is filled in steelblue beneath a path generated by `d3.area()`, while `d3.axisBottom` and `d3.axisLeft` provide labeled axes. Data is loaded asynchronously via `fetch` and parsed with `d3.csvParse` from a remote CSV source.

Ssriram.official9@gmail.com
84% match
Loading thumbnail…

reusable scatter

This example demonstrates a reusable scatter plot that visualizes Titanic passenger data, comparing age against fare and coloring points by gender. The visualization alternates between two halves of the dataset every five seconds, using a custom `scatterPlot` function built with D3 v6. The chart employs `scaleLinear` for axes, `scaleOrdinal` with `schemeCategory10` for colors, and `axisLeft`/`axisBottom` for tick marks. Data is loaded via `d3.csv` from a remote source, and the animation uses `setInterval` to switch plots, removing and redrawing SVG circles.

Ssriram.official9@gmail.com
82% match