3D Scatter Plot

100%

3D Scatter Plot

✓ Published0🌍 Public

Last edited Apr 6, 2023

Created on Apr 6, 2023

This 3D scatter plot visualizes data from an ice company dataset, comparing new and used product values against company names and cities. Built with Plotly.js and D3.js, the visualization renders two separate 3D marker traces—one plotting New versus Used values by company, another plotting New versus Total Sales New by city. The code loads data from a GitHub gist CSV file using D3’s csv function, then constructs interactive 3D scatter plots with configurable marker sizes, opacity, and colors within a minimal-margin layout.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

Made in this video:

MIT Licensed

Similar vizzes

Loading thumbnail…

3D Scatter Plot

This example shows a 3D scatter plot of sales data, displaying the relationship between total sales, number of clients, and products sold. Each data point appears as a semi-transparent red marker in a three-dimensional space. The visualization is created using Plotly’s `Plotly.newPlot` method, with data loaded from a CSV file via D3’s `d3.csv` function. The scene includes labeled axes with colored titles, and the layout margins are minimized to focus on the plot itself.

Kkakumanusreya

83% match

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

83% match

Loading thumbnail…

3D Scatter plot using D3.js

This example shows a 3D scatter plot of two separate datasets from an ICE Bonus CSV file, rendered on a single Plotly chart. One trace maps ItemType, TotalRevenue, and Country while the other maps OrderDate, SalesChannel, and TotalProfit, with colored circular markers in 3D space. The code uses D3.js to load and parse the CSV via `d3.csv`, then passes the data through custom `unpack` functions to extract columns. Plotly’s `scatter3d` trace type and `Plotly.newPlot` render the interactive visualization in the `myDiv` element on an HTML page.

Ggayathrikavya

82% match

Loading thumbnail…

Scatter Plot using D3.JS

This example visualizes a 3D scatter plot of city-level economic indices, comparing cost of living, rent, local purchasing power, groceries, and restaurant prices across different cities. Two distinct traces plot each city as a marker, with hover text identifying the city name. The code uses the Plotly JavaScript API, specifically `Plotly.newPlot`, to render the chart, while D3.js (version 3.5.17) is used to load CSV data from a GitHub gist via `d3.csv`. The visualization demonstrates integrating D3 for data fetching with Plotly for 3D rendering.

Kkottenikhil

80% match

Loading thumbnail…

3D Scatter Plot

This 3D scatter plot visualizes Apple product data, mapping original price, discounted price, and ratings along the x, y, and z axes. The plotly.js library renders the interactive 3D scene, while the d3.csv method loads the data from a remote CSV file hosted on GitHub. Each marker’s size is fixed, with a semi-transparent fill and gray outline, and axis titles are colored distinctly to aid legibility. The layout’s margins are minimized to maximize the plot area within the page.

BBhanuMotupalli

79% match

Loading thumbnail…

3D Scatter Plot

This 3D Scatter Plot visualizes product sales data, plotting relationships between brand, lipstick, and area code in one trace, and area code, brand, and foundation in another. The code uses D3’s `d3.csv` to load the dataset from a GitHub gist, then builds two `scatter3d` traces via Plotly’s JavaScript API, populating a `newPlot` inside the `myDiv` element.

AAnitha Shivaramaiah

79% match

Loading thumbnail…

3D Scatter

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.

RRaajithaSabbineni

79% match

Loading thumbnail…

3d Scatter plot Bonus ICE

This 3D scatter plot visualizes video game sales data from a CSV file, plotting year, global sales, and publisher for one trace, and year, other sales, and publisher for a second trace. Built with Plotly’s `scatter3d` trace type and `Plotly.newPlot`, the visualization uses D3.js’s `d3.csv` to load the data and the `unpack` function to extract columns. Markers are styled with size, opacity, and line properties, rendered in an interactive 3D space within a single div.

MManohar Kowthavarapu

79% match