Fork of example of line chart

100%

Fork of example of line chart

✓ Published0🌍 Public

Last edited Apr 19, 2022

Created on Apr 19, 2022

This scatterplot visualizes the relationship between horsepower and weight for a sample of automobiles, with each car represented by a semi-transparent red circle. Built with D3 v5, it uses scaleLinear to map both variables and customizes the axes with tick formatting and labels. The visualization loads automobile data from a CSV file and renders it as SVG, demonstrating axis customization through the axisBottom and axisLeft APIs.

AI-generated description

This bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017. It also demonstrates customization of D3 axes.

See also the first bar chart visualization that this one builds on: Making a Bar Chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Customizing Axes

This scatterplot displays the relationship between horsepower and weight for various automobile models, with each point representing a vehicle. The chart uses D3 v5's `scaleLinear`, `axisLeft`, and `axisBottom` to construct customized axes with removed domain lines and formatted tick labels, such as converting billions to B. Data is loaded from the auto-mpg.csv dataset. The visualization also adds custom axis labels and a title, demonstrating how to tailor D3's default axes for clearer data presentation.

DDurga Prasad

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars, with each red semi-transparent circle representing a vehicle. The code uses D3 v5’s `csv`, `scaleLinear`, `axisBottom`, and `axisLeft` to load data from the UCI Auto MPG dataset and render an SVG chart. Axes include tick marks and labels, while a title and rotated y-axis label are manually positioned. Filtering and data type conversion occur before rendering, matching the original example’s styling and layout.

AAlexandre Pinho

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a collection of cars. The visualization uses red semi-transparent circles to represent individual data points, with axis labels and a title clarifying the chart’s purpose. The code loads data from the Auto MPG Data Set via `d3.csv`, then renders the chart as an SVG using D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` APIs. Styling is applied through external CSS, and the axes include custom tick formatting and gridlines.

NNALLANATHAN

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This fork of a cars scatter plot visualizes the relationship between horsepower and weight for a dataset of automobiles. The code uses d3.csv to load the auto-mpg dataset, d3.scaleLinear for both axes, and d3.axisBottom with d3.axisLeft to render the chart, with circles drawn in SVG. The styling, including tick labels and axis labels, is defined in an external stylesheet, and the visualization includes grid lines generated through tickSize properties.

KKHUN LOUN ZAI

88% match

Loading thumbnail…

example of scatter plot

This scatter plot visualizes the relationship between horsepower and weight for various car models, with each circle representing an individual car. The plot uses D3’s `scaleLinear` for both axes and renders circles via SVG, with axes customized using `axisBottom` and `axisLeft`, including tick lines and labels. Data is loaded from a CSV file containing auto-mpg statistics, and the visualization distinguishes overlapping points through semi-transparent red circles. The chart title is displayed at the top, and all styling is handled through external CSS.

Zzjutkarma

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the UCI Auto MPG dataset. The code uses D3 v5 to load CSV data, create linear scales for both axes, and render red, semi-transparent circles for each car. The chart includes labeled axes and a title, with gridlines and tick marks styled via CSS. The visualization demonstrates a straightforward data exploration using D3's `scaleLinear`, `axisBottom`, `axisLeft`, and SVG rendering.

Ppinlin0816157

88% match

Loading thumbnail…

scatter plot

This scatter plot displays the relationship between horsepower and weight for cars, using red semi-transparent circles scaled along linear axes. The visualization loads data from a remote CSV file and renders it as an SVG, with D3’s `scaleLinear`, `axisBottom`, and `axisLeft` APIs generating gridlines and tick marks. Axis labels and a title clarify the chart, while margins and redundant axis titles structure the layout. The code imports specific functions from D3 v5 and applies CSS styling for opacity and typography.

Zzhangfa

87% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the Auto MPG dataset, with each red circle representing a vehicle. The code uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct axes, while `csv` loads the data from a VizHub-hosted file. SVG rendering places titled axes and semi-transparent circles, with styling handled via CSS. The visualization emphasizes the positive correlation between the two variables, showing how heavier cars tend to have higher horsepower.

Zzenoe

87% match