BONUS ICE

100%

✓ Published0🌍 Public

Last edited Apr 7, 2023

Created on Apr 7, 2023

This interactive 3D scatter plot visualizes the relationships between age, deep sleep percentage, and awakenings. Each red circular marker represents a data point, with its position along the three axes corresponding to the three variables. The visualization uses the Plotly.js library to render the 3D scene and D3.js to fetch and parse the CSV data from a GitHub gist. The chart allows users to explore the dataset by rotating and zooming into the plot, with axis labels clearly indicating the variables.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Fork of Fork of BONUS ICE 1: 3D Scatter Plot

This example visualizes the relationship between age, sleep duration, and sleep efficiency as a 3D scatter plot. Each point represents an individual, with yellow markers outlined in black, positioned along three axes that display the variables. The code loads CSV data from a GitHub gist using D3’s `d3.csv` function, then constructs the trace with Plotly’s `scatter3d` type and renders it via the `Plotly.newPlot` API. Axis titles and marker styling are configured through the layout and trace objects.

DDineshK2602

83% match

Loading thumbnail…

Fork of Anv_ICE-6 Scatter plot

This scatter plot visualizes the relationship between age groups and their average deep sleep percentage, with each data point representing an individual. The visualization uses D3.js v7 within a React framework, rendering as an SVG. The code employs `d3.csv` to load the dataset, `d3.scaleLinear` for both axes, `d3.extent` to determine domains, and `d3.axisBottom` and `d3.axisLeft` for axes. A legend is added using color ticks. The data comes from a GitHub gist, and the page uses a light blue background with Arial font.

TTekmal-Bhavana

82% match

Loading thumbnail…

BONUS ICE SCATTER PLOT

This 3D scatter plot visualizes the relationship between age, height, and weight, using gender to color the markers. The visualization loads CSV data via the `d3.csv` function and renders a single marker trace with Plotly's `scatter3d` type. The code explicitly names the axes as Height, Weight, and Body Fat, with the marker color set to a uniform pink. The chart is generated using Plotly's `newPlot` method, which draws the interactive plot inside a designated HTML division.

Vviswak12

80% match

Loading thumbnail…

ICE 6 Scatter Plot Manasa V Jadda

This scatter plot visualizes sleep efficiency against age, with each circle colored by deep sleep stage and sized to reflect sleep duration and REM sleep percentage. It uses D3 v6’s `csv` loader to parse the sleep-efficiency dataset, `scaleLinear` for both axes, and `axisLeft`/`axisBottom` for tick marks. The SVG is rendered full-window with static circle markers, colored via a hardcoded switch on species-like values, and manually rotated axis labels styled with inline fonts.

MManasa891-git

79% match

Loading thumbnail…

Fork of Bonus ICE - 3D Scatter plot - Manasa-1

This 3D scatter plot visualizes the relationship between sleep duration, REM sleep percentage, and deep sleep percentage, using data from a sleep-efficiency CSV file fetched from GitHub. The visualization uses Plotly.js to render the interactive `scatter3d` trace, with D3.js handling CSV parsing via `Plotly.d3.csv` and data extraction through the custom `unpack` function. Each point represents a sleep record, colored and sized uniformly, with axes labeled for all three variables.

MManasa891-git

79% match

Loading thumbnail…

ICE Bonus

A three-dimensional scatter plot displays the relationship between height, weight, and age for individuals in a dataset. Each point represents a person, with size and opacity fixed, while colored markers show the three variables on the x, y, and z axes. The visualization uses Plotly’s `newPlot` function to render the `scatter3d` trace, and D3’s `d3.csv` method loads the data from a remote GitHub gist. The layout margin is set to zero for a clean, focused view.

DDINESH SAI BOPPANA

78% match

Loading thumbnail…

BONUS ICE - 1: 3D Scatter Plot

This example visualizes property price based on nearby stores and property age using a 3D scatter plot. The code loads CSV data via d3.csv, then plots three variables—PropertyYears on the x-axis, UnitPrice on the y-axis, and NearbyStores on the z-axis—as orange markers with green outlines using Plotly’s scatter3d trace type. The layout defines axis titles and colors, and the chart renders inside a designated div via Plotly.newPlot. Data comes from a GitHub gist, and the visualization emphasizes relationships among the three numeric dimensions.

Vviswak12

77% match

Loading thumbnail…

BONUS ICE - 1: 3D Scatter Plot

This 3D scatter plot visualizes real estate prices as a function of house age and the number of nearby convenience stores. The Plotly `scatter3d` trace renders each property as a pink marker, with axes labeled for the three variables, all positioned within a minimal margin layout. The visualization loads CSV data from a GitHub Gist via D3's `d3.csv` parsing, then arrays of values are extracted and fed into the `Plotly.newPlot` API to generate the interactive chart.

RRajeevMukhesh

76% match