Skip to main content
SimilarExport ZIP
100%

Task_8_Activity_2_Question_2

✓ Published0🌍 Public
Jjordanwolfe2@my.untdallas.edu
Last edited Apr 14, 2024
Created on Apr 14, 2024
Forked from Task_8_Activity_2

A stacked bar chart displays 2022 home run percentages across MLB league divisions, with each bar divided into five color-coded team segments. The visualization uses d3.stack() to compute stacked series, d3.scaleBand for the y-axis categories, and d3.scaleLinear for the x-axis percentages. Interactive tooltips appear on hover, showing the specific team and percentage value. The SVG chart includes axis labels, a title, and a custom color scale applied via d3.scaleOrdinal, with data loaded from a local CSV file.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Task_8_Activity_4_Question_4

This bubble chart visualizes the correlation between win percentage, run differential, and home runs for 2022 MLB teams, with each circle representing a team. The x-axis shows run differential, the y-axis win percentage, and circle size scales with home run totals, while colors distinguish league divisions. The visualization uses d3.csv to load data, d3.scaleLinear for axes and bubble sizing, and d3.scaleOrdinal with d3.interpolateTurbo for color encoding. Interactive tooltips appear on mouseover, and the chart includes size and color legends rendered as SVG elements.

Jjordanwolfe2@my.untdallas.edu
83% match
Loading thumbnail…

Activity6_Question2_3

This stacked bar chart compares home and away cricket match wins across teams, using horizontal bars where each team’s total wins are segmented into two colored parts. The visualization loads CSV data from GitHub, employs d3.stack for data stacking, and uses D3 v7 with SVG rendering to draw the chart, including axes, labels, a legend, and a tooltip that shows team and win-type details on hover.

Ggnitishreddy0245@gmail.com
80% match
Loading thumbnail…

task2

This example presents a stacked horizontal bar chart titled "Most viewed sports," visualizing the percentage distribution of ratings across six sports (Football, Basketball, Cricket, Tennis, Golf, Athletics) using five rating categories from a CSV file. The chart uses `d3.scaleOrdinal` for color mapping and `d3.scaleBand` for the category axis, with `d3.stack` to aggregate the percentage data. Interactive tooltips display exact percentage values on mouseover, and the SVG rendering employs `d3.axisBottom` for the x-axis and custom styling from CSS.

Yyashwanthkirla95@gmail.com
80% match
Loading thumbnail…

Activity 6_Task-2_Question_2

This example visualizes the distribution of viewership ratings across five sports, using a horizontal stacked bar chart where each bar segment represents the proportion of viewers in a rating category (e.g., "Below 5.0", "5.0-6.5"). The chart, rendered with D3.js v7, employs a band scale for the y-axis and a linear scale for the x-axis. The code builds the stacked bars using `d3.stack` and `d3.scaleOrdinal` for color mapping, with interactive tooltips showing exact percentages on hover. Data is loaded from a static CSV file.

Rrajkodavati7@gmail.com
80% match
Loading thumbnail…

Task_8_Activity_3_Question_3

This scatter plot visualizes the relationship between MLB run differentials and winning percentages for teams from 2010 to 2022. It uses color-coded circles to represent different league divisions (NL West, AL East, etc.), with each point positioned by its run differential (x-axis) and win percentage (y-axis). The visualization is built with D3 v6, loading CSV data from a GitHub repository and rendering SVG circles. The code uses D3's scaleLinear, extent, axisLeft, and axisBottom APIs alongside custom color-mapping logic to distinguish league divisions.

Jjordanwolfe2@my.untdallas.edu
80% match
Loading thumbnail…

Activity-6-Question-2

A stacked bar chart shows the percentage of student ratings across six subjects, with each bar segmented into five rating bands from "below 60%" to "above 90%". The chart uses `d3.stack()` to compute the layered data and `d3.scaleOrdinal()` for color encoding. Interactive tooltips appear on mouseover, displaying the exact percentage for each segment. The visualization is rendered as an SVG with axes created via `d3.axisLeft()` and `d3.axisBottom()`, reading data from a local CSV file.

Nnaveen.dodda4321@gmail.com
80% match
Loading thumbnail…

Task 6.2

This example shows a stacked horizontal bar chart comparing five sports across five attributes—Popularity, Physical Intensity, Strategy, Teamwork, and Entertainment Value—using data from a CSV file. The visualization uses D3 v7 with SVG rendering, employing `d3.stack()` to create stacked segments, `d3.scaleOrdinal()` for color mapping, and `d3.scaleBand()` for the categorical y-axis. Hovering over any segment triggers a tooltip displaying the exact percentage for that attribute, while the chart includes a legend and axis labels for clarity.

Pperamranji
80% match
Loading thumbnail…

Task8_Q2)

This example shows a stacked bar chart of cricket scores by country, with individual bars colored by player name and an interactive tooltip revealing each player's score on hover. Built with D3.js v7, it renders an SVG visualization using `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` with `d3.schemeCategory10` for colors. Data is loaded asynchronously from a CSV file via `d3.csv`, and a custom tooltip is implemented using D3's selection and transition methods. A legend is generated dynamically using `color.domain()` and appended as HTML to the page body.

Mmulyasuji999@gmail.com
79% match