Skip to main content
SimilarExport ZIP
100%

3D Scatter

✓ Published0🌍 Public
RRaajithaSabbineni
Last edited Jul 7, 2022
Created on Jul 7, 2022

This 3D scatter plot visualizes used car data, showing two series of markers that map selling price against kilometers driven, with the z-axis comparing mileage for one series and maximum power for the other. The visualization uses Plotly.js to render the interactive scatter3d plots and D3.js to load and parse the CSV data from a GitHub gist, with styling applied through HTML and CSS.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

3D Scatter Plot

This example visualizes monthly vehicle sales as a 3D scatter plot, comparing new and used sales volumes across two overlapping marker groups. The first trace plots New, Used, and Total Sales New; the second plots New, Total Sales New, and Total Sales Used, with gray and blue markers for contrast. Data is loaded from a CSV file using d3.csv, then rendered through Plotly’s scatter3d type with configurable marker size, opacity, and line styling. The layout removes all margins to maximize the plot area.

Vvagdevi-369
87% match
Loading thumbnail…

3D Scatter Plot

A 3D scatter plot displays Toyota car data, plotting price, tax, and mileage for one series of markers, while a second series shows price, tax, and miles per gallon. The visualization uses Plotly’s `scatter3d` trace type within a `Plotly.newPlot` call, rendering interactive markers with adjustable opacity and line styling. Data is loaded via `d3.csv` from a remote GitHub-hosted CSV file, and the layout collapses the chart margins to zero. The plot compares vehicle cost and efficiency metrics across two distinct attribute combinations.

RRohith Reddy
85% match
Loading thumbnail…

Car sale Analyis

This interactive 3D scatter plot visualizes car sales data across three consecutive years (year20, year21, year22) as points in three-dimensional space. Each marker’s position corresponds to a vehicle’s metrics in those years, colored blue with black outlines and 0.8 opacity. The visualization uses the Plotly JavaScript library (via `plotly-2.9.0.min.js`) and loads CSV data through d3.csv from a GitHub gist. The code defines a scatter3d trace with explicit axis titles, then renders it into a div using `Plotly.newPlot`.

Hharika-1929
82% match
Loading thumbnail…

ICE-reusable scatter

This example demonstrates a reusable scatter plot implemented with D3.js, visualizing a used car dataset. It plots selling price against various attributes—max power, kilometers driven, mileage, or selling price—which rotate automatically every two seconds. Each point is color-coded by car status (sold in green, unsold in red) with a legend. The chart leverages D3’s `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` APIs, and uses SVG rendering with animated transitions between attribute axes.

RRaajithaSabbineni
81% match
Loading thumbnail…

Untitled

This example displays a 3D scatter plot of car sales data, with month, number sold, and price plotted along the three axes. It renders two distinct marker traces, one with a default style and another with a grey color and circular symbols, allowing for comparison. The visualization is built using Plotly’s `newPlot` API, which draws the chart into a designated `div` within an HTML page. The data is loaded asynchronously via `d3.csv` from a remote CSV file, and rows are transformed into arrays using a custom `unpack` helper function.

GGogineni44
81% match
Loading thumbnail…

Fork of 3D Scatter Plot

This 3D scatter plot visualizes monthly vehicle sales using two distinct marker groups, with gray and colored points differentiating categories in three-dimensional space. Built with Plotly.js 2.9.0, the visualization loads data from a CSV file hosted on GitHub via d3.csv, then maps the x, y, and z coordinates from the specified columns into two traces. Custom marker styling, including size, opacity, and colored borders, distinguishes the second dataset from the first, while the layout removes all margins to maximize the plotting area.

KKELVIN WAMBUA NZIOKI
80% match
Loading thumbnail…

Untitled

This example presents a 3D scatter plot of car specifications, visualizing horsepower, mileage, and price for different brands. Each car is represented as a colored marker, with color encoding brand identity: Honda appears cyan, Mercedez green, and Ferrari red. The visualization is built with Plotly.js, specifically using the `Plotly.newPlot` API to render a `scatter3d` trace. Data is loaded via D3.js (`d3.csv`) from a cars dataset, with marker colors assigned by iterating through the brand column and pushing corresponding color values into an array.

Mmanojgne
80% match
Loading thumbnail…

SCATTER PLOT

A scatter plot visualizes the relationship between two numeric variables from a dataset of automobile characteristics, with each circle representing a car's miles per gallon and horsepower. Built with D3 v5, the visualization uses `scaleLinear` for axes, `axisLeft` and `axisBottom` for tick marks, and SVG circles with a light blue fill and opacity for data points. Data is loaded via `csv()` from a remote URL, with numeric fields parsed and rendered into a bounded plot area with custom axis labels.

Ccocktaildata
79% match