Skip to main content
SimilarExport ZIP
100%

ICE6 scatter plot

✓ Published0🌍 Public
RRinoj-Gautam
Last edited Mar 23, 2023
Created on Mar 22, 2023
Forked from HTML Starter

This scatter plot visualizes the relationship between glucose levels and the Diabetes Pedigree Function, with each point colored red or blue to indicate the outcome of diabetes diagnosis. The axes are scaled linearly using `d3.scaleLinear`, and tick labels are rendered at 24 pixels. The visualization is built with D3 v6 and React, loading CSV data from a GitHub gist, and uses `d3.axisLeft` and `d3.axisBottom` for the axes. Circles are positioned by glucose and pedigree function values, while age and blood pressure are encoded as `rx` and `ry` attributes, though they do not affect the visual output.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Making Scatter Plot ICE6

This visualization displays a scatter plot of the Pima Indian Diabetes dataset, plotting Glucose levels on the x-axis against DiabetesPedigreeFunction on the y-axis. Each circle is colored by the Outcome variable using d3.scaleOrdinal with two distinct colors, and size is fixed at a radius of 7. The React component uses d3.scaleLinear for both axes, with SVG rendering via React elements. The code leverages d3.csv for data loading, custom AxisBottom and AxisLeft components for tick marks, and tooltips generated through SVG title elements within the Marks component.

RRinoj-Gautam
88% match
Loading thumbnail…

Fork of BONUS ICE 1: 3D Scatter Plot

This 3D scatter plot visualizes the relationship between Glucose, Blood Pressure, and Diabetes Pedigree Function from a diabetes dataset. Red circular markers with black outlines and 80% opacity represent individual data points. The visualization uses Plotly’s `scatter3d` trace type within a `Plotly.newPlot` call, with data loaded via D3’s `d3.csv` parser from a GitHub gist. Axes are labeled with custom font styling, and the plot includes a minimal margin layout for a clean presentation.

RRinoj-Gautam
83% match
Loading thumbnail…

Scatter Plot - Project 16

This scatter plot visualizes a diabetes dataset, mapping glucose levels on the x-axis against BMI on the y-axis, with each point colored by outcome (red for positive, green for negative). It also encodes insulin and blood pressure values into the `rx` and `ry` attributes of the circles, creating elliptical markers. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct the axes. Data is loaded asynchronously via `d3.csv` from a GitHub gist URL, with a custom row parser converting numeric fields.

Ggayuvurukuti@gmail.com
82% match
Loading thumbnail…

Fork of ICE-7 : Reusable Scatter Plot

This example visualizes diabetes-related health metrics in a responsive scatter plot, mapping pregnancies on the x-axis, glucose levels on the y-axis, and varying symbol shapes based on skin thickness. It uses d3.scaleLinear, d3.scaleOrdinal, d3.axisLeft, d3.axisBottom, d3.symbols, and d3.symbol to generate SVG marks. The reusable chart function supports custom accessors, margins, and symbol size, drawing data from a CSV of diabetes records. The plot fills the browser window with hidden scrollbars and large axis tick text.

MM Hema
81% match
Loading thumbnail…

ICE-6 Scatter Plot

This scatter plot visualizes heart stroke prediction data, showing the relationship between average glucose level (x-axis) and age (y-axis). Each circle represents a data point, with color encoding smoking status: blue for formerly smoked, yellow for never smoked, green for smokers, and red for unknown. The visualization uses D3 v6 APIs including `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes. The data is loaded from a GitHub gist CSV file using `d3.csv`, and the SVG is rendered to fill the full browser window with a custom legend implied by the color mapping.

BBhanuMotupalli
81% match
Loading thumbnail…

Fork of ICE-7 : Reusable Scatter Plot

This scatter plot visualizes the relationship between the number of pregnancies and glucose levels in a diabetes dataset, with skin thickness encoded through symbol size. Built with D3.js, it renders an SVG that fills the browser window, using the `scatterPlot` reusable component to map data values to positions and sizes. The plot applies margins and tooltips, displaying tick labels at 24 pixels, and pulls data from a remote CSV file fetched asynchronously with `d3.csv`.

MM Hema
80% match
Loading thumbnail…

ICE-6 Scatter Plot

This D3.js scatter plot visualizes an insurance dataset, mapping BMI to charges for individual patients. Points are colored red for smokers and green for non-smokers, using a custom `scaleLinear` mapping for the axes. The visualization employs `csv` for data loading, `select` and `join` for SVG circle rendering, and `axisLeft`/`axisBottom` for labeled axes, with all text styled in cursive. The plot includes age and children values as `rx` and `ry` attributes on the circles, though these do not affect the visual output.

Ggayuvurukuti@gmail.com
80% match
Loading thumbnail…

ICE-6 Scatter Plot

This scatter plot visualizes the relationship between age and BMI using an insurance dataset, with each point colored by species. The visualization uses D3 v6 with SVG rendering, loading data from a GitHub gist via `d3.csv` and parsing numeric values. Axes are generated with `axisLeft` and `axisBottom`, while `scaleLinear` maps data domains to pixel ranges. Circle marks are drawn using `selectAll` and `join`, with axis labels styled via SVG text elements in a React-friendly HTML page.

SSrujana390
79% match