Skip to main content
SimilarExport ZIP
100%

ICE 6 Manasa V Jadda

✓ Published0🌍 Public
MManasa891-git
Last edited Mar 22, 2023
Created on Mar 22, 2023

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…

ICE6

A React-based bar chart visualizes letter frequencies from a CSV dataset. Built with D3 v7, it uses `scaleBand` for the x-axis and `scaleLinear` for the y-axis, rendering bars with rounded corners and a teal fill. Clicking a bar toggles its selection, highlighting it while dimming others. The chart includes axes with gridlines, titles, and responsive sizing via a `ResizeObserver`.

PP Manisha
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