rohitpotluri@my.unt.edu

Fork of Activity7_Q2

This visualization presents a rotating sequence of three area charts that explore different feature pairs from the Wisconsin Breast Cancer dataset, cycling every five seconds with animation. The code uses D3 v6’s `scaleLinear`, `area`, and `curveMonotoneX` to render monotone-smoothed, semi-transparent steelblue areas, with axes and labels generated via `axisBottom` and `axisLeft`. Each chart compares measurements like mean radius against mean texture, sourced from a CSV loaded through D3’s `csv` function.

Activity7_Q1

Act 6 Q 4

This interactive bubble chart maps wine samples by Alcohol and Malic Acid on the x- and y-axes, with bubble size encoding Proline levels and color distinguishing three wine types. The d3.v7 visualization uses `d3.scaleLinear` for axes and bubble radius, `d3.scaleOrdinal` for category colors, and SVG circles for rendering. Hovering triggers a tooltip showing wine type and Proline value. Data comes from the wine.csv dataset, with legends for both size and color scales.

Task 4 Act 6

This animated bubble chart visualizes the correlation between average horsepower, torque, and highway MPG for various car makes. Each circle’s position encodes horsepower and torque, its size represents highway MPG, and its color maps to the car manufacturer. The visualization includes interactive tooltips on mouseover and a legend for bubble size and color categories. Built with D3.js v7, it uses `d3.scaleLinear`, `d3.scaleOrdinal`, and `d3.axisBottom` to render SVG elements, with data loaded from a CSV file.

Activity 6 Q 3

This scatter plot visualizes the Wine dataset, displaying the relationship between Alcohol and Malic.acid with points colored by wine class (1, 2, 3) using red, green, and blue. The visualization loads CSV data via `d3.csv`, applies `d3.scaleLinear` for both axes, renders SVG circles, and includes axis labels and ticks generated with `d3.axisLeft` and `d3.axisBottom`.

Activity 6 task 3.2

Activity 6 task 3.1

This example visualizes the Iris dataset as a scatter plot, mapping petal length and width to the x and y axes while coloring points by species (setosa, versicolor, and virginica) using skyblue, lightgreen, and orange. It also encodes sepal length and width as the horizontal and vertical radii of each circle, creating an elliptical shape. The code loads CSV data from a GitHub repository with `d3.csv`, scales the domains using `d3.scaleLinear` and `d3.extent`, and renders SVG circles with `d3.selectAll` and `.join`. Axes are generated with `d3.axisLeft` and `d3.axisBottom`, and labels are appended as SVG text elements.

Activity6 task1 Q1

This visualization uses stacked bar charts to show the distribution of IMDb movie ratings across different genres. Each bar is divided into five rating categories, from "below 5.0" to "above 8.5", with colors and tooltips revealing the exact percentage for each segment. Built with D3 v7, the code employs `d3.stack()`, `d3.scaleBand()`, `d3.scaleLinear()`, and `d3.axisBottom()` to render the SVG, while `d3.select()` manages interactive hover effects that highlight bars and display percentage values.

Activity6_Task2

Activity 6 task 1

This D3 v5 bar chart displays the population of ten countries in the year 2000, with a horizontal bar for each country. The visualization uses a linear scale for population and a band scale for country names, with bars colored green and tick marks in blue. Data is loaded from a CSV file using the `d3.csv` function and parsed to convert the population values. The React framework renders the SVG components, with separate modules for the bottom axis, left axis, and the marks themselves.

Activity 6 task 1.1

This example displays a horizontal bar chart of the top 20 countries by population in 2010, read from a remote CSV file via d3.csv. The React app maps the data to SVG rectangles using d3.scaleBand for the y-axis and d3.scaleLinear for the x-axis, with axes built from d3.scaleBand.ticks and tick formatting via d3.format('.2s'). Hovering reveals the population value in a tooltip through the SVG `<title>` element.

6 reflections buddha

This visualization renders a layered, abstract Buddha figure using React and SVG, overlaid with numerous semi-transparent, randomly colored polygons that create a kaleidoscopic effect. The code generates a grid of rotated polygons with randomized positions and fill colors, while a detailed SVG path defines the Buddha’s silhouette. The image is set against a flower background image, and the entire composition is scaled and translated, producing a colorful, reflective mosaic.

5 buddhas