harsha new

100%

✓ Published0🌍 Public

Last edited Apr 9, 2024

Created on Apr 9, 2024

Two side-by-side bar charts compare top-ten country rankings from separate datasets. The first shows GDP per capita using `d3.scaleBand` and `d3.scaleLinear`, with hover tooltips displaying country and value. The second visualizes gross primary education enrollment, also as ranked bars. Both use D3 v6 with SVG rendering, load CSV data via `d3.csv`, and include rotated axis labels for readability.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

csce5320finalfinalproject

This example presents two side-by-side bar charts ranking the top ten countries by GDP per capita and by gross primary education enrollment. The charts use D3.js version 6 to load CSV data from remote GitHub sources and render scalable vector graphics (SVG). Each bar chart uses `d3.scaleBand` for the x-axis and `d3.scaleLinear` for the y-axis, with `d3.axisBottom` and `d3.axisLeft` for ticks. Interactive tooltips appear on bar mouseover, showing the country name and the corresponding metric value.

Ssriharshakondakindi@gmail.com

86% match

Loading thumbnail…

Project

Two side-by-side bar charts compare the top ten countries by GDP per capita and by gross primary education enrollment. The first chart uses steelblue bars to rank countries by economic output, while the second displays education enrollment figures. Both visualizations are built with D3 v6 and render SVG bar charts with axes and mouseover tooltips. The data is loaded from three separate CSV files using `Promise.all` and `d3.csv`.

Ppslharika@gmail.com

82% match

Loading thumbnail…

harsha activity6

This bar chart shows the top 30 countries by population in 2020. The visualization uses React to render SVG elements and d3-scaleBand for the categorical y-axis and d3-scaleLinear for the quantitative x-axis, with population values formatted from raw data. Data is loaded asynchronously via d3.csv from a GitHub-hosted CSV file. A horizontal bar for each country is created with SVG rect elements, and axis ticks are generated using the scale functions, with tooltips provided through SVG title elements.

Ssriharshakondakindi@gmail.com

79% match

Loading thumbnail…

Act 6.2

A stacked horizontal bar chart compares GDP growth distributions across fourteen countries, with each bar divided into five percentage-range categories. Built with D3 v7, the visualization maps country names to the y-axis using `d3.scaleBand`, GDP percentage ranges to x-axis positions via `d3.scaleLinear`, and color-codes segments by category using `d3.scaleOrdinal`. Data from `data.csv` is loaded and transformed through `d3.stack`, while interactive hover effects display precise GDP percentage values via a tooltip. The SVG output includes labeled axes and a legend, with styling provided by external fonts and CSS.

VVenkataSatyaRamKamini@my.unt.edu

77% match

Loading thumbnail…

harsha actvity6que1

This bar chart displays the population of ten countries for the year 2000, with countries listed on the y-axis and a formatted horizontal population scale. Built with React and SVG, it uses D3's `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis. The `Marks` component renders each bar with a tooltip, while `AxisBottom` and `AxisLeft` generate the tick marks and labels. Population data is loaded from a remote CSV file.

Ssriharshakondakindi@gmail.com

77% match

Loading thumbnail…

harsha activity6que2

This visualization displays the populations of 20 countries for the year 2010 using a horizontal bar chart. The chart is built with React and D3 v5, using `scaleBand` for the country categories on the y-axis and `scaleLinear` for the population values on the x-axis. Population data is loaded from a CSV file via D3's `csv` function, with values multiplied by 1000. The SVG rendering includes custom axis components and tooltips that format large numbers using D3's `format` function with SI prefixes.

Ssriharshakondakindi@gmail.com

77% match

Loading thumbnail…

Untitled

This interactive bar chart displays GDP per capita for a selection of countries, with bars colored in blue and one highlighted in orange. Users can hover over individual bars to see details and click a checkbox to sort the values in descending order. Built with React and D3 v4, the visualization uses `d3.scaleBand` and `d3.scaleLinear` to map country names and GDP values to SVG coordinates, with `d3.axisBottom` rendering the x-axis labels. The dataset is embedded directly in the code, and CSS classes define the bar colors for normal and highlighted states.

UUtsav Vachhani

76% match

Loading thumbnail…

new vitesh

Two side-by-side bar charts compare the ten countries with the highest Global Innovation Index (GII) scores. The left chart displays each country’s 2023 population, while the right chart shows its GII value, using the same country order for direct visual comparison. Built with D3 v6, the example fetches and merges two CSV datasets, then renders SVG bar charts with rotated x-axis labels. The code uses `d3.csv` for data loading, `d3.scaleBand` and `d3.scaleLinear` for scales, and `d3.axisBottom` plus `d3.axisLeft` for axes.

Vvikramkotlo9@gmail.com

76% match