Skip to main content
SimilarExport ZIP
100%

Cars Scatter Plot

✓ Published0🌍 Public
HHarish M A
Last edited Jul 6, 2020
Created on Jul 6, 2020
Forked from Cars Scatter Plot

This interactive scatter plot uses D3.js to visualize automotive data across multiple dimensions, with points plotted on an SVG canvas and brushable for detailed exploration. The visualization incorporates a world map background rendered with topojson and d3.geo projections, allowing users to filter car data by geographic region through a modal interface. The code leverages Bootstrap modals for control panels and DataTables for tabular data display, while animations and player controls enable temporal filtering of the dataset.

AI-generated description

This bar chart shows population of top ten most populous countries. The data comes from the year 2020 estimate in UN : World Population Prospects 2020.

MIT Licensed

Similar vizzes

Loading thumbnail…

Cars Scatter Plot

This interactive scatter plot lets users explore the relationships between different attributes of cars from the auto-mpg dataset. Dropdown menus dynamically select which numeric columns are plotted on the x and y axes. The visualization uses D3’s `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to construct axes with gridlines, and `transition().duration(1000).delay()` animates circles to new positions when axes change. Data is loaded via `csv()`.

Ffloresh
86% match
Loading thumbnail…

Cars - ScatterPlot

This interactive scatter plot explores car sales data, letting viewers compare any two numeric variables on the X and Y axes while optionally coloring points by a categorical field. The visualization uses D3.js v7 with a CSV data source, and automatically detects whether columns are numeric or categorical to populate the dropdown controls. It renders data points as SVG circles with smooth transitions when changing axes, includes grid lines and axis labels, and displays a tooltip with details on hover.

Mmaddineni2112@gmail.com
86% match
Loading thumbnail…

Cars Scatter Plot

This interactive scatter plot uses the D3 library to visualize relationships between pairs of attributes from the auto-mpg dataset. Two dropdown menus let the user select which columns to plot on the x and y axes. The visualization employs `scaleLinear` to map data to screen coordinates and `axisLeft` and `axisBottom` to render axes. Points animate into place using D3 transitions, with each circle's `cx` and `cy` attributes tweened over 500 milliseconds when the axis selection changes.

AAnShed
86% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes car data from the World (esa.un.org) by rendering each vehicle as a semi-transparent red circle. The visualization encodes the dataset’s two dimensions along linear x and y axes, with tick labels and an axis-label generated from the data’s extent. The code uses d3.csv for data loading, d3.scaleLinear for mapping, and d3.axisLeft and d3.axisBottom for the axes. A linear gradient is defined in the SVG defs, while circles are styled via CSS with fixed red fill and opacity, producing overlapping clusters.

Llinlala
85% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot from D3 v5 visualizes automotive data, mapping each car’s weight on the x-axis and horsepower on the y-axis using d3.scaleLinear and SVG circles. The axes are generated with d3.axisBottom and d3.axisLeft, and tick labels are formatted using d3.format. The chart loads data from a remote CSV file and applies a semi-transparent steelblue fill to the circles, with margins, axis labels, and a title configured for readability.

Rratschke
85% match
Loading thumbnail…

Cars Scatter Plot.js

This example displays a scatter plot of automobile data, mapping horsepower on the x-axis against weight on the y-axis. Each point represents a car model, rendered as a translucent blue circle with a fixed radius. The visualization uses D3.js v5, employing `scaleLinear` for both axes and `extent` to compute the domains. The SVG output includes gridlines generated by `axisLeft` and `axisBottom`, with the resulting data loaded from a local CSV file (auto-mpg.csv) covering vehicle specifications.

Dddperdue
85% match
Loading thumbnail…

Cars Scatter Plot with menus

This interactive scatter plot visualizes the auto-mpg dataset, allowing users to select which columns appear on the x- and y-axes via dropdown menus. The visualization uses D3 v5 with SVG rendering and animated transitions, where circles expand from the center to their positions over two seconds. The code imports reusable modules for the dropdown menu and scatter plot, utilizing D3 scales (scaleLinear, scalePoint), axes (axisLeft, axisBottom), and the extent function to determine data domains.

SSophia Murage
85% match
Loading thumbnail…

Cars Scatter Plot

This interactive scatter plot visualizes automotive data from the UCI Machine Learning Repository’s Auto MPG dataset, mapping weight on the y-axis against a user-selectable x-axis column via a dropdown menu. A dropdownMenu module updates the x-axis label and scales on selection. Using D3 v5 with SVG rendering, the code employs scaleLinear, extent, axisLeft, axisBottom, and selectable circle elements to display each car as a semi-transparent point.

Pphdiamantino
84% match