Gender count for each department

100%

Gender count for each department

✓ Published0🌍 Public

Last edited May 11, 2020

Created on May 11, 2020

Forked from 2017 Gender Wage Gap in the US

This example visualizes the gender distribution across seven academic departments (CAM, COM, CSIS, GAV, MED, MUL, VIS) using a dot plot with pink and light blue circles representing female and male counts respectively. The chart displays both genders per department, connected by black lines to facilitate comparison of relative values. Built with React and D3 v5, the visualization uses `d3.scaleBand` for the y-axis, `d3.scaleLinear` for the x-axis, and SVG circles and lines rendered from the `earning_averages_by_year.csv` data source. Gridlines and axis labels are generated using `d3.axisBottom` and `d3.axisLeft`.

AI-generated description

A bare minimum HTML page.

Similar vizzes

Loading thumbnail…

Gender Distribution Chart

This interactive chart visualizes gender distribution across university modules, displaying stacked bars for male and female counts that can be toggled between raw values and percentages via radio buttons. The visualization uses D3.js (v3) with SVG rendering and includes animated transitions when switching between the two display modes. Data comes from CSV files containing module codes and gender-specific enrollment numbers. The chart features a color-coded legend and a hover tooltip, with axes labeled and rotated for readability.

KKeerthiKandadai

80% match

Loading thumbnail…

Fork of Fork of Fork of Student count for Each department

This scatter plot visualizes the relationship between the number of female and male students in different academic departments, using data from a CSV file accessed via a URL. Each circle represents a department, with its position determined by the female and male student counts, while the color encodes the major category and a tooltip reveals the department name. The visualization is built using the Vega-Lite API, with data loading handled by D3's `csv` function, and features custom styling for the axes and labels. The chart is rendered as an SVG that fits the full browser window.

NNarayana Reddy

80% match

Loading thumbnail…

Fork of Student count for Each department

This scatter plot visualizes the relationship between the number of female and male students across academic departments, with each circle representing a department and color encoding its major category. The visualization uses data loaded from a CSV file via D3’s `csv` function, and is rendered with the Vega-Lite API, which registers with Vega and Vega-Lite to create an SVG output. Tooltips are enabled through the vega-tooltip handler, while the chart’s axes and labels are styled using a custom configuration object. The plot is displayed full-screen with automatic resizing to fit the viewport.

NNarayana Reddy

79% match

Loading thumbnail…

Student count for Each department

A scatter plot presents the average female student count against the average male student count for each department, with color encoding for the major category and tooltips revealing the specific module. Data is loaded from a CSV file via d3.csv. The visualization is built using the vega-lite-api, which layers vega-lite specifications and renders with the vega engine. Circle size is fixed, while axis and style configurations improve readability.

Mmarksampras

79% match

Loading thumbnail…

Student count for Each department

A scatter plot shows the relationship between female and male student counts across academic departments, with each circle colored by major category and a tooltip revealing the module name. The visualization uses the vega-lite-api library to define the chart specification, loading data from a CSV file via d3.csv. It renders through vega-lite and vega, with a custom dark-themed configuration for axes and labels. The circle size is fixed rather than encoding a third variable, and the chart fills the browser window.

KKeerthiKandadai

79% match

Loading thumbnail…

Fork of Fork of Student count for Each department

This scatter plot visualizes the relationship between female and male student counts across academic departments, with each point colored by major category and tooltips revealing the specific module name. The visualization uses the Vega-Lite API with D3.js to load CSV data from a GitHub repository, and renders the chart as an SVG. Circle size is fixed rather than data-driven, and the plot employs a custom dark-themed configuration for axis styling and label readability.

NNarayana Reddy

78% match

Loading thumbnail…

Gender - Version 1.2

This interactive sunburst chart visualizes the gender distribution of participants across university modules, rendering hierarchical data as an animated radial diagram. Users toggle between male and female datasets via a dropdown menu, with data loaded from separate JSON files. The visualization highlights selected branches on mouseover, displaying the percentage, raw count, and path breadcrumb in the center. Built with D3 v4’s `d3.partition` and `d3.arc`, it uses color-coded segments to represent academic departments.

KKeerthiKandadai

78% match

Loading thumbnail…

Fork of Fork of Fork of Student count for Each department1

This scatter plot visualizes student counts across departments by plotting Female counts on the x-axis and Male counts on the y-axis, with color encoding for Major_category and tooltips for Module. The visualization loads data from a remote CSV using d3.csv and renders through the vega-lite-api library, which registers with vega and vega-lite. Circle marks are configured with a fixed size of 150, and the chart fills the browser window using the width and height properties. The data source is fetched from a GitHub-hosted final3.csv file, and the visualization includes custom axis styling and grey-tinted titles from the config object.

NNarayana Reddy

78% match