Skip to main content
SimilarExport ZIP
100%

ViewCircles

✓ Published0🌍 Public
KKondreddy Saikiran reddy
Last edited Apr 24, 2024
Created on Apr 24, 2024
Forked from barChart

ViewCircles visualizes state-wise rice production in India as an interactive bar chart. The chart sums district-level data from a CSV file using `d3.rollup` and `d3.sum`, mapping states to bar heights with `d3.scaleBand` and `d3.scaleLinear`. Hovering over a bar triggers a tooltip showing the total production for that state. The SVG rendering uses `d3.axisBottom` and `d3.axisLeft`, with a `d3.schemeCategory10` color scale and mouse event handlers for interactivity.

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…

ViewCircles

This example visualizes groundnut production by state using a filtered bar chart of circles, with year-based checkbox filtering to adjust the displayed data. Built with D3 v7, it loads CSV data from a GitHub gist and uses D3’s `csv`, `scaleBand`, `scaleLinear`, `scaleOrdinal`, `rollup`, and `sum` APIs to aggregate and render the SVG output. A tooltip appears on mouseover, and the chart updates dynamically by removing and redrawing circles based on the selected years.

KKondreddy Saikiran reddy
88% match
Loading thumbnail…

barChart

This bar chart displays rice production totals for each state, aggregated from district-level crop data using `d3.rollup` and `d3.sum`. The SVG rendering uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.schemeCategory10` for per-state colors. Hovering over a bar triggers a tooltip via D3 transitions, showing the summed production in tons. Data loads asynchronously from a CSV file, with axes drawn using `d3.axisBottom` and `d3.axisLeft`.

KKondreddy Saikiran reddy
79% 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
79% match
Loading thumbnail…

Barchart

This bar chart displays rice production across Indian states, with tooltips revealing the corresponding rice area for each state. The visualization is built with D3.v7 and rendered as SVG, using a band scale for the categorical x-axis and a linear scale for the production values. The chart includes rotated x-axis labels and mouseover interactions that present additional data. It loads data from a CSV file hosted on GitHub and highlights the use of d3.csv, d3.select, d3.scaleBand, d3.scaleLinear, and d3.axisBottom.

SSree Yuktha Sunkara
78% match
Loading thumbnail…

Fork of barChart

This visualization displays rice production across Indian states using a bar chart, where each bar represents the total production for a state with a unique color. The chart loads data from a CSV file via `d3.csv`, and uses `d3.rollup` to aggregate production values by state. Hovering over a bar reveals a tooltip showing the state name and its total production, with rounded values to two decimal places. The visualization uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` with `d3.schemeCategory10` for bar colors, with axes labeled and rotated via `d3.axisBottom`.

Ssindhuja27b@gmail.com
78% match
Loading thumbnail…

ICRISAT District Level Data - Rice Production BarChart

This bar chart visualizes total rice production across Indian states using ICRISAT district-level data. The chart aggregates production values per state via `d3.rollup` and renders them as colored bars with a custom purple-grey ordinal scale. Interactive tooltips appear on mouseover, displaying the state name and total production. The visualization loads D3 v7 from UNPKG, uses SVG for rendering, and includes rotated axis labels for readability, with data fetched via `d3.csv`.

PPothuguntla Pranitha
78% match
Loading thumbnail…

Fork of ICRISAT District Level Data - Rice Production BarChart

This bar chart visualizes the total rice production across Indian states using ICRISAT district-level data, aggregated with d3.rollup and d3.sum. It renders an SVG with d3.scaleBand and d3.scaleLinear, applying a custom purple-grey ordinal color scale per state. Interactive tooltips display rounded production totals on mouseover, while axes and labels are generated via d3.axisBottom and d3.axisLeft. The chart uses d3.v7 and includes hover transitions for user engagement.

Wwanghaili628@gmail.com
77% match
Loading thumbnail…

Barchart2

This interactive bar chart visualizes rice production across Indian states from 1966 to 2017, allowing users to filter the data by year using checkboxes. The chart aggregates production values with `d3.rollup` and renders SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`, with hover tooltips highlighting individual states. It loads data from a CSV file via `d3.csv` and updates the visualization dynamically in response to checkbox selections.

KKondreddy Saikiran reddy
77% match