Skip to main content
Log in
A

amanipeddolla@my.unt.edu

@amanipeddolla·13 public vizzes

Loading thumbnail…

Activity6_Task4

A bubble chart visualizes correlations between average weight, sugar content, and price per kilogram for various fruits. Sized circles encode price, while color distinguishes fruit types. Built with d3.v7, it uses `d3.scaleLinear` for axes and bubble size, `d3.scaleOrdinal` with `d3.interpolateTurbo` for colors, and an interactive tooltip on mouse events. Data loads from a CSV file, rendered as SVG, with hover opacity changes and a size legend.

Oct 19, 2024
Loading thumbnail…

Activity6_Task4_bubblechart

This bubble chart visualizes the correlation between average horsepower, torque, and highway MPG for various car makes. Each circle represents a car brand, positioned by its horsepower and torque values, with the circle's radius scaled to its highway MPG using `d3.scaleLinear`. The color of each bubble is assigned via a `d3.scaleOrdinal` with an `interpolateTurbo` palette, and a legend maps bubble sizes to MPG values. Data is loaded from a CSV file, and interactive tooltips appear on hover using D3's selection and transition methods, all rendered as an SVG.

Oct 19, 2024
Loading thumbnail…

Tutorial_task_3.2

This scatter plot visualizes the relationship between production staff’s weekly output, comparing Units/Hour in Week 1 against Week 2. Each point uses a distinct custom shape—triangle, pentagon, hexagon, star, or heart—to encode the staff member’s position, with a legend identifying shape categories. The chart is built with D3 v7 and React, using `scaleLinear` for axes, `scaleOrdinal` for shapes, and `axisBottom`/`axisLeft` for ticks. Data is fetched as a CSV from GitHub and parsed with `csvParse`.

Oct 19, 2024
Loading thumbnail…

Activity6_Task3

This scatter plot visualizes the Iris dataset, showing petal width against petal length for three species, each color-coded as skyblue, lightgreen, or orange. The chart uses D3 v6 scales and axes to position circles, with SVG rendering in React. Data is loaded via `d3.csv` and parsed to numeric values. The visualization also sets circle radii based on sepal measurements, though the primary axes focus on petal dimensions.

Oct 19, 2024
Loading thumbnail…

Activity6_Task2

A stacked horizontal bar chart, titled "Time Spent on Daily Activities," visualizes the proportional distribution of time across five categories for ten daily activities. Each bar represents an activity, with colored segments showing the percentage of time spent in categories like "less than 1 hour" to "more than 6 hours". The visualization uses D3 v7 with an SVG rendering approach, employing `d3.stack()` to generate the stacked data and `d3.scaleOrdinal` for color mapping. Interactive tooltips display exact percentages on hover, built with D3 event handlers and HTML div elements.

Oct 19, 2024
Loading thumbnail…

Fork of activity 6_Task 1 _Q2

This bar chart displays the population of 20 countries in 2010, using data from a CSV file loaded via D3's `csv` function. The visualization uses React and SVG, with D3 `scaleBand` and `scaleLinear` for axes. Blue tick lines and green bars are rendered from mapped data, with a tooltip showing formatted population values, and the x-axis label "POPULATION-2010" clarifies the metric.

Oct 19, 2024
Loading thumbnail…

activity 6_Task 1

This visualization presents a horizontal bar chart comparing the populations of ten countries in 2000, with countries listed along the vertical axis and population values represented by bar widths. The chart uses React with D3 v5, leveraging `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis. Data is loaded via `d3.csv` from a GitHub-hosted CSV file, with population values processed by multiplying the 2000 column by 1,000. The SVG rendering includes custom `AxisBottom` and `AxisLeft` components, while each bar in the `Marks` component includes a native `title` tooltip showing the formatted population value.

Oct 19, 2024
Loading thumbnail…

5 buddha

A dense field of randomly generated, semi-transparent polygons rotates and overlaps against a black background, creating a chaotic, layered visual texture. Built with React and rendered as SVG, the example uses nested `Array.map` calls to generate shapes with random coordinates, colors, and rotation transforms. A large Buddha silhouette path is embedded within the composition, serving as an intricate focal point amid the geometric noise.

Oct 18, 2024
Loading thumbnail…

6 Buddha

Six concentric Buddha silhouettes overlap in a decorative, flower-themed visualization, rendered with semi-transparent, randomly colored dots that form a meditative mandala. The piece uses React to generate 31 points of random data repeated in nested loops, drawing each as a small SVG circle. The Buddha figures themselves are defined as SVG `<path>` elements, scaled and translated, while the background is a flower image applied via CSS. The code runs entirely client-side, relying on ReactDOM for rendering and the SVG specification for vector graphics.

Oct 17, 2024
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Fork of Fork of Fork of Buddha in colors -overlapping Buddha

This visualization layers dozens of semi-transparent Buddha path traces over a floral background, creating a dense, kaleidoscopic overlap effect. It renders with React and SVG, mapping random positions and fill colors from an array of 30 values. The code uses nested `.map()` functions to generate the repeated null elements and random RGB color generation for the overlapping forms.

Oct 17, 2024
Loading thumbnail…

Buddha

The visualization presents a decorative mandala of overlapping Buddha images, rotating at 60-degree intervals around a shared center. It combines two rendering systems: a React-generated SVG that randomly draws multicolored polygons as a chaotic background pattern, and CSS-transformed `<img>` elements that layer the Buddha portraits over it. The React code uses `ReactDOM.render` with array mapping to generate visual elements, while the rotation effects rely on CSS `nth-child` selectors and `transform` properties.

Oct 17, 2024
Loading thumbnail…

5 Buddhas

Five Buddhas renders a grid of overlapping, semi-transparent polygons that cluster into five distinct meditative figures. The piece layers thousands of randomly generated triangles, colored via `rgb(Math.random() * 500, ...)` with opacity, on a black SVG canvas. A predefined SVG path depicting a Buddha silhouette is transformed and scaled, then superimposed five times, creating a dense, colorful mandala-like composition. Built with React and rendered as SVG, the work juxtaposes algorithmic noise with structured iconography.

Oct 14, 2024
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Buddha in colors -overlapping Buddha

A black SVG canvas displays dozens of small, semi-transparent circles scattered randomly across the viewport, layered over a large, colorful Buddha silhouette rendered as a path. React maps over nested arrays to generate each circle with random positions and RGB fill values, while the Buddha shape uses a fixed SVG path with a thick stroke and no fill. The visualization combines generative randomness with a structured vector icon to create a dense, overlapping color field.

Oct 14, 2024