AbhinavReddyKaripireddy@my.unt.edu

Act 7_tutorial

This interactive scatter plot cycles through the Iris dataset's four numeric attributes on the x-axis, showing how petal and sepal measurements separate the three species by color. Built with d3.js 6.7.0, it uses a reusable `scatterPlot` module with `scaleLinear` and `axisBottom`/`axisLeft` for coordinate and axis construction, while a `setInterval` timer drives the automatic axis rotation. The animation renders as SVG with circles, a custom legend, and rotating axis labels, drawing data from a remote CSV file hosted on GitHub.

Apr 10, 2025

Act6_ques4

This bubble chart visualizes the relationship between company revenue and profit, with bubble size encoding employee count for six named companies from an inline CSV dataset. The visualization uses D3 v7 with SVG rendering, employing `d3.scaleLinear` for the x and y axes, `d3.scaleSqrt` for bubble radii, and `d3.scaleOrdinal` with `d3.schemeTableau10` for color coding. Axes are generated using `d3.axisBottom` and `d3.axisLeft`, with labels indicating revenue and profit in millions of USD.

Act6_Task4

This bubble chart shows the correlation between average horsepower, torque, and highway MPG for various car makes. Each circle's position encodes horsepower (x-axis) and torque (y-axis), while its radius scales linearly with highway MPG. The chart uses D3 v7’s scales and axes, with color mapped via `d3.interpolateTurbo` for make categories. A hover tooltip displays each car make, and a legend communicates both the MPG bubble-size scale and the categorical color scheme. Data comes from the provided CSV file.

Act6_task3.2

This scatter plot displays the Iris dataset, comparing sepal length against petal length for three species of iris flowers. Each species is distinguished by a unique symbol shape, with a legend positioned on the right side of the chart. The visualization is built using D3 v7, employing `scaleLinear` for both axes, `scaleOrdinal` for shape encoding, and `symbol` to generate the marks. Data is loaded asynchronously via `fetch` and parsed with `csvParse` before being rendered.

Act6-task3.2

This scatter plot shows the relationship between Math and Science scores for 90 students, with each point's shape indicating the student's group (A, B, or C) as defined in the data.csv file. The d3.js library (v7) renders the visualization as an SVG, using a linear scale for both axes to map scores from 50 to 100. The ordinal scale maps group categories to symbol shapes via `d3.symbol`, enabling visual comparison of score distributions across the three groups.

Activity6_Question1

This visualization shows the population of 20 countries in 2010 using a horizontal bar chart, with bars sorted in descending order from China to the United Kingdom. The chart uses D3 v7’s `scaleBand` for the categorical country axis and `scaleLinear` for the population values, rendering bars as SVG `rect` elements. Hovering changes the bar color to orange via CSS. Data is loaded from a CSV file with `d3.csv`, and axes are formatted with `d3.axisLeft`, `d3.axisBottom`, and `d3.format` for abbreviated tick labels.

Activity 6_Task 1

A horizontal bar chart displays 2020 population estimates for the top 30 countries from a CSV dataset. It shows population values as steelblue bars with formatted labels, using a linear scale for the x-axis and a band scale for countries on the y-axis. Built with D3 v7 and rendered as SVG, the code uses `d3.csv`, `scaleLinear`, `scaleBand`, `d3.axisBottom`, and `d3.axisLeft`.

Fork of Fork of Activity 6_Task 1

This bar chart displays the populations of the top 30 countries in the year 2020, sourced from the included Activity6_Population.csv dataset. Each bar is rendered using SVG rectangles, with the country’s population value labeled directly at the end of each bar. The visualization is built with D3 v7, utilizing the `d3.scaleLinear` and `d3.scaleBand` scales to map data, while axes are created via `d3.axisBottom` and `d3.axisLeft`. The chart is presented with a clean layout, using a steelblue fill for the bars against a white background.

Fork of Activity 6_Task 1

A horizontal bar chart displays the population of the top 30 countries in 2020, with steelblue bars labeled with their values. Using d3.v7, the code loads CSV data via `d3.csv`, sorts it, and renders SVG with `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis. Axes are drawn with `d3.axisBottom` and `d3.axisLeft`, while custom Mark components append rectangles and text labels, formatting numbers with `d3.format`.

Activity 6_Task 1

A horizontal bar chart displays the top 30 countries by 2020 population, sourced from an Activity6_Population.csv file. Steel-blue bars, rendered with SVG rect elements, list countries along the y-axis and population values along the x-axis. The chart uses D3 v7’s `selectAll` and `join` pattern to create bars and labels, with `d3.scaleBand` for the categorical axis and `d3.scaleLinear` for the numeric range.