Skip to main content
SimilarExport ZIP
100%

Scatter Plot

✓ Published0🌍 Public
Rr79162810@gmail.com
Last edited Mar 28, 2024
Created on Mar 28, 2024
Forked from Scatter Plot

This reusable scatter plot visualizes the relationship between calorie content and price for various beverages, with each circle representing a beverage. The chart uses D3.js v6 to load a CSV dataset, scale the axes linearly, and render circles positioned by calorie content on the x-axis and price on the y-axis. Axes are generated using d3.axisBottom and d3.axisLeft, while circles are appended as SVG elements with a steelblue fill. The static, responsive layout centers the plot on a white background, with styled text and axes for readability.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This reusable scatter plot visualizes the relationship between calorie content and price for menu items, with each circle colored by category. The visualization uses D3.js v6 with an SVG rendering approach, loading data from a CSV file hosted on GitHub Gist. The code implements linear scales for both axes, an ordinal color scale using `d3.schemeCategory10`, and renders circles positioned by the x and y scales. Axis construction uses `d3.axisBottom` and `d3.axisLeft`, while the data loading relies on `d3.csv` with promise handling. The chart displays points with a radius of 5 pixels, colored according to categorical values.

Rr79162810@gmail.com
87% match
Loading thumbnail…

Scatter Plot

This reusable scatter plot displays the relationship between calorie content and price for inventory items, with each circle positioned along the x- and y-axes according to those numeric values. Built with D3 v6, the visualization loads a CSV file and maps its fields to linear scales, using `d3.scaleLinear` for both axes and `d3.axisBottom` and `d3.axisLeft` to generate tick marks and labels. The SVG output renders circles with a fixed radius and steel-blue fill, while axis titles clarify the measured variables.

Rr79162810@gmail.com
87% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the relationship between calorie content and price for menu items, with each point colored by category using a D3 ordinal color scale. The visualization uses `d3.scaleLinear` for both axes and `d3.axisBottom`/`d3.axisLeft` for ticks. Data is loaded asynchronously from a GitHub gist via `d3.csv`, then mapped to SVG circles with `d3.select` and `append`. The SVG rendering includes styled axes and labeled dots within a fixed 460×400 viewport.

Vvp9156623@gmail.com
85% match
Loading thumbnail…

Fork of Scatter Plot

This scatter plot visualizes the relationship between calorie content and price for food items, with each point colored by category using a categorical color scale. Built with D3 v6, the visualization renders as an SVG and loads data from a CSV file hosted on GitHub. The code defines linear scales for both axes, maps data values to circle positions, and applies the `d3.scaleOrdinal` color scheme with `d3.schemeCategory10` for category-based coloring.

Mmadipadiga.raviteja@gmail.com
81% match
Loading thumbnail…

Kumar Danam Reusable Scatter Plot ICE-7

This reusable scatter plot displays calorie count against price for a menu of drinks and snacks, with each point colored by a category-specific hex value from the dataset. Built with D3.js v7, the chart uses the `d3.scaleLinear` API for axis scaling and `d3.axisBottom`/`d3.axisLeft` for tick marks, while tooltips appear on hover via mouse events. The SVG rendering follows a configurable function that accepts data, attribute names, and dimensions, making the visualization portable across different datasets.

KKumar Danam
81% match
Loading thumbnail…

Bubble Chart

This bubble chart compares beverage types by rating, glucose, and calorie content using d3.csv to load the data and d3.scaleLinear for the x, y, and bubble-size scales. It renders SVG circles with d3.schemeSet1 for color encoding by beverage brand, and includes manual legends for calorie size and brand colors. The code uses d3.axisBottom and d3.axisLeft for the axes.

SSwapna1915
79% match
Loading thumbnail…

Bubble Chart

This bubble chart compares beverage manufacturers by plotting glucose levels on the x-axis, ratings on the y-axis, and calorie count as bubble size, with color distinguishing beverage types. Built with D3 v7, the visualization uses d3.scaleLinear for axes and bubble sizing, d3.scaleOrdinal for color mapping, and d3.schemeSet1 for the categorical palette. Data is loaded from a local CSV file using d3.csv, and the SVG rendering includes custom legends for both bubble size and color categories, with all marks styled with red strokes and 0.7 opacity.

EEtupino
76% match
Loading thumbnail…

task 8 task 4

This bubble chart displays the relationship between glucose levels, beverage ratings, and calorie counts across seven beverage brands. The x-axis maps glucose levels, the y-axis shows beverage ratings, and circle size encodes calories. Data is loaded from a CSV file using d3.csv, while d3.scaleLinear and d3.scaleOrdinal position the points and assign colors based on beverage type. The visualization renders as SVG with axis labels, a calorie size legend, and a color-coded brand legend.

Jjaswanthichowdarykalapala@my.unt.edu
76% match