ICE 6 Manasa V Jadda

100%

ICE 6 Manasa V Jadda

✓ Published0🌍 Public

Last edited Mar 22, 2023

Created on Mar 22, 2023

Forked from Fork of Fork of ICE-6 Bar Graph

This visualization displays earthquake magnitudes using a horizontal bar chart of the top 12 seismic events. The chart highlights each earthquake’s title on the y-axis and its magnitude on the x-axis, with red gridlines marking tick values. The code uses React with hooks and D3 v5’s `scaleBand`, `scaleLinear`, `csv` parsing, and SVG rendering to draw the bars. Data is loaded from a GitHub-hosted CSV file, with a basic color scheme and minimal styling.

AI-generated description

A whole smiley face

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-6

This bar chart displays the magnitudes of earthquakes across different states in India, ranking the first 50 records from a CSV dataset. The visualization uses React for component structure and D3 v5 scales and SVG rendering to map state names to a y-axis band scale and magnitude values to an x-axis linear scale. Blue gridlines and labeled axes help compare the relative severity of seismic activity across regions, with data loaded asynchronously via D3’s `csv` function and rendered as horizontal rectangles.

Aav.dj.2000@gmail.com

85% match

Loading thumbnail…

ICE 5 Manasa

This visualization displays recent earthquake data from a live feed, mapping occurrences geographically. The page uses an SVG element with a patterned background and an embedded base64-encoded JPEG map image to provide the contextual geography. The implementation loads D3 v7 from a CDN and relies on standard JavaScript to fetch and process the dataset, while the visual layout is styled with custom CSS that sets a sky-blue page background and centers the descriptive headings.

MManasa891-git

84% match

Loading thumbnail…

ICE 6 Bar Chart

This bar chart displays the average impact magnitude of earthquakes across different locations, filtering for values above 3.0. It reads data from a CSV file containing earthquake records, processing it with p5.js’s `loadTable` and custom sorting logic in `setup`. The visualization uses p5.js’s `createCanvas` and drawing functions, including `rect` for bars and `text` for labels and tick marks, to plot each location’s average magnitude. Japanese and Afghan averages are highlighted directly on the chart.

MM Hema

80% match

Loading thumbnail…

ICE-6

A horizontal bar chart displays the top 20 rated anime, with each bar’s length proportional to its rating. The visualization loads CSV data via `d3.csv`, sorts by rating, and renders SVG bars, axes, and labels using React components. It uses D3 scales (`scaleBand`, `scaleLinear`), axis ticks, and text elements for annotation. The chart is styled with CSS in the HTML file, and the React app updates state after data retrieval.

RRaajithaSabbineni

79% match

Loading thumbnail…

ICE-6 Part 2

This example visualizes earthquake data from a CSV file, plotting latitude against longitude as a scatter plot with each point sized by depth. The chart uses D3 v6 to load and parse the data, then renders SVG circles with color-coded species markers. Axes are generated using `scaleLinear`, `axisLeft`, and `axisBottom` APIs. The visualization dynamically fills the browser window and includes labeled latitude and longitude axes.

Aav.dj.2000@gmail.com

78% match

Loading thumbnail…

ICE-6

This visualization shows the maximum temperature for the first 11 weather stations from a CSV dataset, displayed as horizontal bars ranked by station name. Using React for component structure and D3 v5 for scales and data loading, the bar chart employs `scaleBand` for the y-axis, `scaleLinear` for the x-axis, and renders grid lines and labels via SVG. The bars are colored steelblue, with tick marks and station names annotated directly in the SVG.

SSweetierams

77% match

Loading thumbnail…

ICE_6 Niharika Reddy Amanaganti

This visualization displays a horizontal bar chart of the top 15 songs by duration, with song names on the y-axis and duration values on the x-axis. The chart uses React to manage state and render the SVG, while D3 v5 provides the scaling functions (`scaleBand`, `scaleLinear`), axis generation, and CSV data loading. Data is fetched from a GitHub gist containing song information, and the bars are drawn as SVG rectangles with blue tick lines and labels generated from the linear scale’s tick values.

NNiharika Reddy Amanaganti

77% match

Loading thumbnail…

Chathurya - Fork of ICE-6 Bar Graph

This interactive bar chart displays the magnitudes of US earthquakes in 2021, with each bar labeled by its source location. It uses React to manage state and render the SVG, while d3’s `csv` loader fetches the remote dataset, and `scaleBand` and `scaleLinear` map the categorical locations and numeric magnitudes to the plot’s axes. Gridlines are drawn with d3’s `scaleLinear.ticks`, and bars are simple SVG `rect` elements.

CChathurya

77% match