Harishma Nallala

100%

Harishma Nallala

✓ Published0🌍 Public

Last edited Jun 23, 2022

Created on Jun 22, 2022

This example displays summary statistics about a dataset of top 51 football players, using an inline SVG illustration of a soccer scene as a visual backdrop. The page presents the dataset’s size in kilobytes, row count, and column count within a styled text element. The code loads the data from a CSV file via `d3.csv`, then uses `d3.csvFormat` to calculate the byte length and accesses the `data.length` and `data.columns.length` properties to compose the message. Styling is handled with CSS, while the SVG is authored directly in HTML.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Csce 5320 Data Visualization ICE 5

This example displays metadata about a hockey player dataset, including row and column counts, in a styled HTML page. It uses D3 v7’s `d3.csv` to load external CSV data from a GitHub gist and `d3.csvFormat` to calculate the data size, displaying the results in a green `pre` element. The page also embeds a static SVG image of a dog from another gist, with yellow heading and centered layout styled via inline CSS. No interactive charts or animations are present.

Ssuchitra2602

77% match

Loading thumbnail…

ICE-4 CSCE 5320

This example displays metadata about a 2022 football teams dataset, including file size, row count, and column count, alongside a static SVG illustration of a football play scene. It loads CSV data from a GitHub gist using D3 v7’s `d3.csv` and formats the dataset with `d3.csvFormat` to compute information presented in a `<pre>` block. The page is built with plain HTML, CSS, and JavaScript, with the SVG chart drawn manually and styled inline.

Pprashanth yamala

77% match

Loading thumbnail…

[ICE-5] Loading and Parsing CSV Data with D3.js

This example demonstrates loading and parsing a CSV dataset of the top 100 football players using D3.js in a plain HTML page. The code fetches the data from a remote GitHub gist via `d3.csv`, then displays the file size in kilobytes, row count, and column count inside a styled `<pre>` element. The page also includes an embedded SVG image and custom CSS styling for headers and paragraphs. While a React starter file is present, the visualization itself relies exclusively on D3 v7 APIs for data loading and formatting.

RRohithReddy-thoughts

77% match

Loading thumbnail…

Fork of ICE-5 DV: Loading and Parsing CSV Data with D3.js

This example demonstrates how to load and parse CSV data with D3.js, displaying a summary of the dataset’s size and structure in a styled HTML page. Using `d3.csv`, it fetches data from a GitHub-hosted CSV file containing Lionel Messi’s statistics, then computes and displays the total file size in kilobytes, the number of rows, and the number of columns. The page also embeds a static SVG illustration via an `<img>` tag, while the text output is rendered in a `<pre>` element with CSS styling.

NNikhitha630

76% match

Loading thumbnail…

Data Visualization

This example presents a simple HTML page that displays a greeting message and loads a remote CSV dataset using D3 version 7. It prints statistics about the data, including its size in kilobytes, row count, and column count, by utilizing `d3.csv` and `d3.csvFormat`. The page also includes an SVG image showing a black ellipse and a filled polygon. The D3 library is loaded via a CDN, and the visualization is rendered through standard HTML and SVG elements.

Hharika-1929

75% match

Loading thumbnail…

Data Visualization

This example displays a simple dashboard that presents a hello message from the author and summarizes a dataset loaded from a GitHub gist. The text announces the file’s approximate size in kilobytes, the number of rows, and the column count. The visualization uses D3.js version 7, specifically the `d3.csv` and `d3.csvFormat` APIs, to fetch and parse the CSV data and then inject the computed summary into an HTML `<pre>` element. The page also embeds an external SVG image and relies on basic CSS for styling.

Hharika-1929

75% match

Loading thumbnail…

ICE-5

This example displays a summary of a dataset about UEFA Champions League club rankings, fetched as a CSV from a GitHub gist. It shows the file size in kilobytes, the number of rows, and the number of columns. The page uses D3 v5’s `d3.csv` to load the data and `d3.csvFormat` to measure its size, then writes the results into a `<pre>` element. Styled with CSS and HTML, it also includes a static yellow SVG circle and a red heading, demonstrating a basic React-free data visualization setup.

Ssandeep-gollamudi

75% match

Loading thumbnail…

assignment 5

This example displays summary statistics from a CSV file, showing the data size in kilobytes, row count, and column count. It uses the D3.js library’s `d3.csv` method to fetch the external dataset and `d3.csvFormat` to calculate the formatted string length. The visualization also includes a simple SVG circle rendered alongside the text, with CSS styling applied to the page. The computed summary is displayed inside an HTML `<pre>` element, updating the page content dynamically.

Ddineshtadepalli12

75% match