Skip to main content
SimilarExport ZIP
100%

Vehicle Scatterplot

✓ Published0🌍 Public
SSwapna1915
Last edited Jul 20, 2023
Created on Jul 17, 2023
Forked from Hello VizHub

This scatterplot visualizes the relationship between vehicle horsepower and weight, using red axis labels to highlight each variable. The visualization loads CSV data from a GitHub gist and uses D3 v5's `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs to map the data points. Each vehicle is rendered as a semi-transparent lime circle on an SVG canvas, with gridlines extending from both axes for easier comparison. The chart includes a title and custom tick styling defined in a separate stylesheet.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the relationship between vehicle horsepower and weight, using a red, semi-transparent circle for each car. The data comes from a CSV file about vehicle specifications. The visualization is built with D3 version 5, using `scaleLinear` for axes, `axisBottom` and `axisLeft` for tick marks, and SVG circles for data points. Axis labels and a title are added as text elements, with grid lines drawn via tick sizing, all rendered in an SVG canvas with custom CSS styling.

AAli Ahmed
94% match
Loading thumbnail…

Scatter Plot

This scatter plot shows the relationship between vehicle horsepower and weight, with each circle representing a car from the provided dataset. The D3 v5 code uses `scaleLinear` to map the data to SVG coordinates, and `axisBottom` and `axisLeft` to generate the axes with gridlines. Data is loaded via `csv` from a remote URL, and the circles are rendered with a red fill and opacity. The chart includes axis labels and a title, styled through CSS.

Zzren2
92% match
Loading thumbnail…

Scatter Plot

A scatter plot visualizes the relationship between horsepower and weight for individual vehicles, with each red circle marking one data point. The chart uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` to map the CSV data loaded via `csv` from a GitHub gist, rendering SVG circles with `selectAll` and `append`. Axis ticks extend across the plot via `tickSize`, and labels and a title are added as SVG text elements, with styling from CSS.

AAli Ahmed
92% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between vehicle weight and horsepower for a dataset of cars, with each car represented by a red semi-transparent circle. The visualization uses D3 v5's `scaleLinear` for both axes, `axisLeft` and `axisBottom` for the labeled axes, and `selectAll`/`enter` patterns to render the SVG circles. Data is loaded from a CSV file and parsed into numeric fields. The chart includes a title, axis labels, and grid lines to aid interpretation.

MMounikaBeerelly
91% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot shows the relationship between vehicle weight and horsepower for a dataset of cars, with each point representing an individual car model. The visualization uses D3 v5’s `csv` loader to fetch data from an external URL, then applies `scaleLinear` and `extent` to map the variables to SVG coordinates. Axes are rendered using `axisBottom` and `axisLeft`, with tick marks extending across the plot area. The SVG circles are styled with red fill and opacity, and axis labels and a title are added via SVG text elements.

NNkwachi Abel
91% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the relationship between vehicle horsepower and weight, with each circle representing a data point from the auto-mpg dataset. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, `axisLeft`, and `extent` APIs to map the data to SVG coordinates within a 960×500 canvas. Data is loaded asynchronously via `csv()` from a remote source, with numeric fields parsed before rendering. The plot includes labeled axes with tick marks spanning the full plot height and width, though the axis labels and titles are incomplete in the code.

LLonwabo11
91% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each point representing an individual vehicle. The visualization uses D3 v5 to load CSV data and render an SVG with linear scales, axes, and semi-transparent red circles. It applies `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.extent` to map values, while axis labels and a title are added via SVG text elements. The chart employs a clean grid layout with margins and tick styling from the accompanying stylesheet.

MMichał Szumnarski
90% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between vehicle weight and horsepower, with each car represented as a semi-transparent red circle. The data originates from an auto-mpg CSV file, loaded via `csv()`, with numeric fields parsed and scales computed using `scaleLinear()`, `extent()`, and `nice()`. D3’s `axisBottom()` and `axisLeft()` render labeled axes with customized tick styling. SVG circles are positioned via `cx` and `cy` attributes, and the chart includes a title, axis labels, and rotated y-axis text.

HHassan Abdullah
90% match