Skip to main content
SimilarExport ZIP
100%

ICE5

✓ Published0🌍 Public
AAbhinav-Mullapudi
Last edited Mar 2, 2023
Created on Feb 28, 2023
Forked from assignment 5

This example displays information about bowlers who took the most wickets in a calendar year, providing metadata about the dataset through a text message on the page. It uses D3.js v7 to load a CSV file from a GitHub Gist via `d3.csv`, computes the data size in kilobytes, row count, and column count using `d3.csvFormat`, and renders the results as plain text in a `<pre>` element. The page also features a background SVG image applied through CSS.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-6

This interactive bar chart displays the top 12 bowlers with the most wickets in a calendar year, using a horizontal layout with labeled axes. The visualization loads data from a CSV file via `d3.csv` and renders the chart as an SVG. React manages the component state and lifecycle, while D3's `scaleBand` and `scaleLinear` position the bars and ticks. The code explicitly draws gridlines, axis labels, and rectangles for each data point, with the title "Most Wickets by a Player in a calender Year" displayed above the chart.

AAbhinav-Mullapudi
84% match
Loading thumbnail…

ICE5

This example displays the metadata of the most browsed songs in 2021, including file size, row count, and column count, on a page with a decorative background. It loads a CSV dataset using `d3.csv` and computes the message text with `d3.csvFormat` and `Math.round`. The page uses D3 v7, vanilla JavaScript, and CSS to present the information, with the result inserted into a `<pre>` element via `textContent`.

DDeeraj Thakkilapati
82% match
Loading thumbnail…

ICE 5 - Loading and parsing of Data (11508271)

This example demonstrates how to load and parse CSV data with D3, displaying basic dataset statistics in a large preformatted text block. It fetches a cricket World Cup winners CSV file from a GitHub gist using d3.csv, then computes the approximate file size in kilobytes, row count, and column count. The page also includes a static SVG image referenced in the HTML. The visualization uses D3 version 7.3.0 and the d3.csvFormat API to calculate the data length while presenting results with a simple centered layout.

Aabdulmoin9624
82% match
Loading thumbnail…

ICE 5

This page displays metadata about the IPL 2016 dataset, including its size in kilobytes, row count, and column count. It uses D3 v7’s `d3.csv` to fetch a CSV file from a GitHub gist and `d3.csvFormat` to compute the data’s size. The page presents the information in a styled `<pre>` element, with a background SVG image and linked dataset details.

Vvineeth-001
82% match
Loading thumbnail…

ICE 5

This example shows a webpage that parses a CSV file containing anime data and displays basic information about it. It uses the D3.js v5 library, specifically the `d3.csv` method to load and parse the remote data from a GitHub Gist, and `d3.csvFormat` to calculate the file size. The resulting message, displayed in a styled `<pre>` element, reports the file size in kilobytes, the number of rows, and the number of columns. The page also includes a static SVG illustration of a face.

Aaashrithd4
82% match
Loading thumbnail…

ICE-5

This example displays a large red and yellow message about cricket data alongside a static SVG house image. Using d3.csv, it fetches a remote CSV file, calculates its size in kilobytes with d3.csvFormat, and counts its rows and columns. The resulting summary appears as plain text in a pre element, styled by CSS. The visualization emphasizes the data-loading process over any graphical mapping, serving as a minimal demonstration of D3 version 7 in a React-hosted HTML page.

SSweetierams
82% match
Loading thumbnail…

ICE 5

This example displays a text-based summary of a CSV dataset, showing the file size in kilobytes, row count, and column count. It loads data from a GitHub-hosted CSV file using `d3.csv`, then computes the formatted output size with `d3.csvFormat` and reads `data.length` and `data.columns.length` to report the statistics. The page uses a custom background image from a GitHub gist, styled with CSS, and outputs the results into a `<pre>` element via `document.getElementById`. The code also links to the original Kaggle company sales dataset.

Nnavyasrimeka9@gmail.com
81% match
Loading thumbnail…

ICE-5

This example displays summary statistics about a film dataset loaded from a GitHub-hosted CSV file, showing the data’s size in kilobytes, row count, and column count. The page uses D3.js v7 to fetch and parse the CSV with `d3.csv`, formats the results via `d3.csvFormat`, and updates the text content of an HTML `<pre>` element. A static SVG background image is embedded as a data URI, while CSS styles apply layout and heading colors. The visualization focuses purely on textual data metrics rather than graphical charts.

BBhanuMotupalli
81% match