Skip to main content
SimilarExport ZIP
100%

Group19_Project

✓ Published0🌍 Public
Ppenumutchu.manobhiram@gmail.com
Last edited Apr 27, 2024
Created on Apr 24, 2024
Forked from Hello VizHub

This example presents two sets of visualizations: bar charts ranking Indian states by rice production and global states by population, a line chart of sugarcane production over time, and a donut chart showing total male and female population sums. It uses D3 v7 to load CSV data, apply scales, render SVG axes, and append rectangles and paths. Interactive tooltips appear on bar hover, and the pie chart labels display gender counts.

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…

Murali Final

This visualization presents a comparative analysis of Indian agricultural and demographic data through four distinct charts. It contrasts the top ten rice-producing states with sugarcane production trends over recent years, while also displaying the most populous states and the national gender distribution. The agricultural bar chart employs interactive tooltips and a color-coded legend, while the demographic charts render data as a bar chart and a pie chart. The implementation uses D3 v7's `scaleBand` and `scaleLinear` for axes, `pie` and `arc` for the pie chart, and CSV data loaded from external gist sources.

Vvikramkotlo9@gmail.com
81% match
Loading thumbnail…

Project_indian_Agriculture

This example presents an interactive bar chart of Indian agricultural data, allowing users to select a state and district from dropdown menus to load corresponding crop statistics. The visualization displays area, production, and yield metrics for various crops across different years using D3.js v7 to render SVG bars. The chart includes hover highlighting and a custom tooltip, with data structured as an inline JSON array containing detailed records for each district and crop type.

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

Production of Rice-saranya

This visualization presents rice production across Indian states using a donut chart, with each segment sized proportionally to production values. The chart employs D3.js v4 to generate SVG paths via the `d3.arc` and `d3.pie` functions, while a custom legend and interactive hover tooltips reveal state names and production numbers. Data originates from a CSV file loaded asynchronously through React’s `useEffect` hook, with the top 10 records displayed. The visualization uses a color scale from `d3.schemeCategory10` and incorporates mouseover effects that adjust opacity and show contextual information.

MMalempatiSaranya
76% match
Loading thumbnail…

Project_Population

This example displays state-level population data for India in 2021 through an interactive line chart. Users select a state from a dropdown menu and load its corresponding visualization, which renders population figures using D3.js v7 in an SVG container. The chart includes a tooltip that appears on hover, styled with CSS transitions to show detailed population metrics. The data is embedded directly in the JavaScript as JSON objects containing comprehensive demographic information for each district.

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

Fork of barChart

This bar chart visualizes rice production across Indian states, using data from a CSV of crop statistics. It shows aggregated production totals per state, with each bar color-coded to its state, and a tooltip displaying the exact production value on hover. Built with D3 v7, the chart uses `d3.rollup` to aggregate district-level data, `d3.scaleBand` and `d3.scaleLinear` for axes, and `d3.schemeCategory10` for colors. The SVG rendering includes rotated x-axis labels for readability.

Ssuchigeneralpur@gmail.com
75% match
Loading thumbnail…

Project

This example displays two grouped bar charts showing population and renewable energy consumption by year, sourced from a CSV dataset hosted on GitHub. It uses D3.js v7 to load and parse the data, group records by year, and render SVG bar charts with linear and band scales. The charts are styled with distinct colors, steelblue for population and orange for renewable energy, and include labeled axes and a legend. The visualization offers a comparative view of demographic and energy trends over time.

Vvenkatabhaskaratetali@my.unt.edu
75% match
Loading thumbnail…

activity 6_Task 1-2

This example shows a horizontal bar chart comparing the populations of 20 countries in 2010, sorted in descending order. The chart uses D3 v5 to create an SVG visualization, with `d3.scaleLinear` mapping population values to the x-axis and `d3.scaleBand` positioning countries along the y-axis. The data is loaded from a CSV file via `d3.csv`, with the population column parsed and filtered to the top 20 entries. Rice-shaped bars are rendered using SVG rectangles, with axis labels and styling applied through CSS classes.

Nnissisharon61@gmail.com
75% match
Loading thumbnail…

Activity6_Task-1

This interactive horizontal bar chart displays the 2010 population estimates for a selection of countries, ranked along the y-axis with bars extending along the x-axis. It uses React to render an SVG graphic, built on D3 v5. The chart fetches its data from a CSV file via `d3.csv`, using `d3.scaleBand` and `d3.scaleLinear` to map country names and population values. Bar tooltips and axis labels are formatted with `d3.format`'s `.2s` notation, converting values like 'G' to 'B'.

Ppenumutchu.manobhiram@gmail.com
74% match