gangireddyarunkumar5@gmail.com

@Arunkumar9390·5 public vizzes

Area chart

This area chart displays monthly average temperatures across a calendar year, using a filled steelblue region to show temperature trends from January through December. The visualization builds an SVG chart with D3 v6, employing `scaleBand` for the month categories, `scaleLinear` for temperature values, and the `area` generator to create the shaded region. Axis labels are added using `axisBottom` and `axisLeft`, which explicitly identify the months on the x-axis and degrees Celsius on the y-axis. The data originates from hardcoded monthly temperature values in the source code.

Nov 3, 2024

Loading thumbnail…

Activity6_Task4

This bubble chart shows the relationship between GDP per capita, life expectancy, and population for ten countries, with circle size encoding population and position encoding the economic and health metrics. The visualization uses D3.js v7 with SVG rendering, employing d3.scaleLinear for the x and y axes and d3.scaleSqrt for the radius scale. Data from countries_data.csv is loaded via d3.csv. Hovering over a bubble increases its opacity, while country labels appear inside each circle. Axis labels for GDP and life expectancy are added using d3.axisBottom and d3.axisLeft.

Oct 20, 2024

Loading thumbnail…

Data visualization

This example shows a horizontal bar chart ranking the top 20 countries by population in 2020 (sourced from a CSV file), with a green bar for each country and blue tick lines on the axes. Built with React and D3 v5, it uses `scaleBand` for the categorical y-axis, `scaleLinear` for the numeric x-axis, and the `format` API to abbreviate population values (e.g., "1.2B"). SVG rectangles are rendered via the `Marks` component, with tooltips provided by SVG `<title>` elements.

Oct 20, 2024

Loading thumbnail…

Activity 6_Task 2

This example demonstrates VizHub’s basic scaffolding for a D3-based visualization. It imports a local ES6 module to define a message string and uses D3’s `select` to set the text of an HTML `div` element. The page loads D3 v5 from a CDN and includes a CSS file, illustrating how external libraries and local styles integrate. The code shows a minimal reactive setup with no data or interactive elements.

Oct 20, 2024

Loading thumbnail…

Arun_Buddha

A generative Buddha illustration renders overlapping colored circles across an SVG canvas. The visualization uses React to map a nested array structure, producing hundreds of semi-transparent circles with random positions and RGB fill values derived from `Math.random()`. A detailed Buddhist figure is drawn via an SVG `<path>` element, layered over the scattered circle field. The code relies on React’s component model and ReactDOM for rendering, with styling set in a black-background HTML document.

Oct 20, 2024