Fork of ICE5

100%

✓ Published0🌍 Public

Last edited Mar 1, 2023

Created on Feb 28, 2023

This example displays metadata about a university dataset, showing the file size, row count, and column count on a webpage. The visualization uses a custom CSS background image and presents the statistics in a large, bold text format. It loads the data from a CSV file using D3 v7, specifically the `d3.csv` and `d3.csvFormat` API functions to fetch and calculate the byte size, then updates the DOM via `getElementById` and `textContent`. The page also includes a link to view the raw dataset source.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Fork of Fork of ICE5

This gallery example shows metadata about a students' performance dataset, displaying the file size, row count, and column count in a large, bold centered text block. The page features a background SVG image of the dataset and links to the raw CSV data. The code uses the D3.js library’s `d3.csv` API to fetch the dataset from a GitHub gist, and `d3.csvFormat` to calculate its size. The presentation is styled with CSS, including a background image, while the metadata message is inserted into an HTML `<pre>` element.

LLakshmiManjushaReddyYarreddu

90% match

Loading thumbnail…

ICE5

This example displays the metadata of a university dataset loaded from a CSV file. Using D3 v7, the code fetches the data with `d3.csv` and computes the file size in kilobytes via `d3.csvFormat`, along with the number of rows and columns. The resulting information is rendered as plain text in a `<pre>` element, while a CSS background image of a credit card and a green accent color style the page. The visualization shows a minimal, text-based summary rather than a graphical chart.

Rradhadevarapu

89% match

Loading thumbnail…

Fork of ICE5

This page displays a student performance dataset. It shows metadata about the data, including its size in kilobytes, row count, and column count, by fetching a CSV file and processing it with D3.js. The visualization uses the `d3.csv` API to load the external data and the `d3.csvFormat` API to calculate the file size. The page presents this information as plain text, with a background image of a student performance SVG and clickable links to the dataset.

Mmanjushalakshmi

89% match

Loading thumbnail…

Fork of ICE5

This page displays metadata for a student performance dataset, showing the dataset’s size in kilobytes, row count, and column count. It fetches the data from a remote CSV file using D3’s `d3.csv` function, then computes the size with `d3.csvFormat` and updates a `<pre>` element’s text content. The page’s background uses a custom SVG image via CSS, with a centered layout and red link styling.

Kkothapally123

89% match

Loading thumbnail…

Fork of ICE5

This example displays metadata for a laptops dataset, showing the file size, row count, and column count on a webpage with a laptop background image. The page presents this summary in large, bold text under a title and a link to the dataset. The code uses D3 v7’s `d3.csv` and `d3.csvFormat` functions to fetch the CSV from a GitHub gist, calculate the character length in kilobytes, and extract the number of rows and columns, then injects the result into the DOM via `textContent`. The layout is styled with CSS for the background and centered typography.

Hhm0421

89% match

Loading thumbnail…

Fork of ICE-5 loading and parsing data with D3.js

This example demonstrates how to load and parse a CSV dataset using D3.js, displaying basic metadata about the data in a simple HTML page. The code fetches a university dataset from a GitHub gist using `d3.csv`, then calculates and presents the file size in kilobytes, the number of rows, and the number of columns. The result is rendered as text inside a `<pre>` element via the DOM API. Built with D3 v7 and plain HTML/CSS/JavaScript, it serves as a minimal educational illustration of asynchronous data loading and parsing without any visualization.

Vvidhyanamini

87% match

Loading thumbnail…

ICE5

This example displays metadata about a student dataset, presenting file size, row count, and column count in a large, bold text overlay. The visualization uses D3.js v7 to fetch and parse a CSV file from a GitHub Gist via `d3.csv`, then formats the data with `d3.csvFormat` to calculate its size in kilobytes. The page’s background features a student-themed SVG image, styled with CSS. Static HTML text and links provide context, while the JavaScript dynamically updates a `<pre>` element with the computed statistics.

KKiran Jyothi Bodduluri-11604571

86% match

Loading thumbnail…

Fork of ICE-5: Welcome to ICE-5 Data visualization

This example presents a welcome page for the ICE-5 data visualization, displaying metadata about a dataset of the top 100 actors. The page shows a summary message with the file size in kilobytes, row count, and column count, alongside a static SVG image. It uses D3.js v7, specifically the `d3.csv` method to fetch and parse a CSV file from a GitHub gist, and then leverages `d3.csvFormat` to calculate the data size. The layout is styled with simple HTML and CSS, including a large title and a cyan message container.

SSweetierams

86% match