Skip to main content
SimilarExport ZIP
100%

Scatter Plot with Color Legend for Udemy Courses

✓ Published1🌍 Public
DdaojunL
Last edited Oct 15, 2020
Created on Oct 14, 2020

This scatter plot visualizes Udemy courses, showing the relationship between course price (x-axis) and the number of subscribers (y-axis). Each circle represents a course, colored by its subject category via a color legend on the right. The visualization uses React with D3 v5 to render an SVG, employing `d3.scaleLinear` for both axes, `d3.scaleOrdinal` for the categorical color mapping, and `d3.format` for axis tick labels. Data is loaded from a CSV file using `d3.csv`.

AI-generated description

A scatter plot of Udemy Courses with color legend.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot with Color Legend

This example shows a scatter plot of Udemy courses, mapping the number of subscribers along both axes while coloring each point by course subject. The visualization includes a categorical color legend on the right, with circles using d3.scaleOrdinal for color mapping and d3.scaleLinear for positioning. The React components render SVG elements, with axes built from custom AxisBottom and AxisLeft components, and the data is loaded via d3.csv from a GitHub gist. A hover handler on the legend logs the selected subject value.

DdaojunL
93% match
Loading thumbnail…

Interactive Color Legend with Menus

A scatter plot of Business and finance courses on Udemy lets users compare any two numeric attributes—price, number of subscribers, published lectures, or content info—via dropdown menus for the X and Y axes. Points are colored by instructional level using a categorical color scale. The accompanying color legend supports hover highlighting, fading non-matching points, while axis ticks are rendered with custom SVG components in React and D3 v5.

Yyyaaa1
84% match
Loading thumbnail…

Interactive Color Legend with Menus

A scatter plot of Business and finance courses on Udemy lets users compare any two numeric attributes—price, number of subscribers, published lectures, or content info—via dropdown menus for the X and Y axes. Points are colored by instructional level using a categorical color scale. The accompanying color legend supports hover highlighting, fading non-matching points, while axis ticks are rendered with custom SVG components in React and D3 v5.

Yyyaaa1
84% match
Loading thumbnail…

Interactive Color Legend with EdX Viewer Data

A scatterplot shows the relationship between active days and video plays for EdX platform users, with each circle's color indicating a course. Hovering over the color legend filters the visualization to display only data points from that selected course while dimming others. The chart uses React with hooks, D3 scales via `d3.scaleLinear` and `d3.scaleOrdinal`, and SVG rendering. Data comes from a CSV of the MITx-HarvardX 2013 academic year dataset.

Ssophburke
77% match
Loading thumbnail…

Course Number of Each Subject

This bar chart shows the number of courses for each subject in a Udemy course dataset. The visualization uses a horizontal bar layout, with subjects listed along the y-axis and course counts along the x-axis. The code aggregates the raw CSV data using d3.nest() and rollup to count entries by subject, then renders the bars as SVG rectangles with React components. It leverages d3.scaleBand and d3.scaleLinear for positioning, and uses d3.format for axis tick labels.

DdaojunL
77% match
Loading thumbnail…

The most subscribed course

This visualization shows the top 10 most subscribed Udemy courses using horizontal bars, with course titles on the y-axis and subscriber counts on the x-axis. The chart uses React components (AxisBottom, AxisLeft, Marks) and D3 v5 scales including scaleBand and scaleLinear, with data loaded via d3.csv from a GitHub gist. The SvG rendering includes a formatting function that converts large numbers to abbreviated units, and each bar displays a tooltip showing the exact subscriber count. The visualization highlights that business finance courses are the most popular among subscribers.

DdaojunL
76% match
Loading thumbnail…

Interactive Color Legend with EdX Viewer Data

An interactive scatterplot displays video plays versus active days for EdX users in 2013, with each circle’s color representing a course. Hovering over the ordinal color legend fades non-matching points and overlays a highlighted subset. Built with React and D3 v5 (scaleLinear, scaleOrdinal), the SVG renders axes via custom components and circles with native HTML titles for tooltips. Data originates from the MITx-HarvardX Dataverse repository.

Ssophburke
76% match
Loading thumbnail…

Vega-Lite API Template for Udemy Course

This visualization shows the relationship between course publication date and subscriber count for Udemy courses, revealing that publication timing has little correlation with subscription numbers. The scatterplot uses Vega-Lite API through d3.v5, with data loaded from a CSV via d3.csv. The visualization applies configurable styling and tooltips via vega-tooltip, with points sized and opacity-adjusted to show density at overlapping coordinates. Both axes use zero-disabled scales for clearer distribution analysis.

DdaojunL
75% match