Skip to main content
SimilarExport ZIP
100%

ICE5

✓ Published0🌍 Public
SSnapika
Last edited Feb 26, 2022
Created on Feb 26, 2022
Forked from HTML Starter

This example displays a simple summary of a car rental dataset, presenting the file size in kilobytes, row count, and column count as plain text. The visualization loads a CSV file from a GitHub gist using d3.csv, then calculates and formats these statistics with d3.csvFormat and Math.round. The page is styled with custom CSS, featuring a large centered title and a responsive message area. The code relies on D3.js v7 and runs entirely within a single HTML file, with no interactive or graphical charting beyond the textual output.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE5

This visualization displays a summary of used car data loaded from a remote CSV file, showing its size in kilobytes, row count, and column count. The page also embeds an external SVG image. The code uses the D3.js library, specifically the `d3.csv` function to fetch and parse the data, along with `d3.csvFormat` to calculate the data size. The message is rendered into an HTML `<pre>` element. The visualization utilizes D3 v7 within a React framework, though the displayed content focuses on basic data characteristics.

GGARIDIDEEKSHITHREDDY
90% match
Loading thumbnail…

ICE-5

This visualization displays a summary of a dataset, reporting the number of rows, columns, and approximate file size in kilobytes. The page loads an external CSV file and uses the D3.js library’s `d3.csv` function with the `d3.autoType` parser to automatically infer data types. After parsing, the code calculates the formatted data length and row count to construct a text message, which is rendered in a `<pre>` element using JavaScript's `getElementById` and `textContent`. The visualization also includes a static SVG image and links to the source data.

Nnikhilagopi
88% match
Loading thumbnail…

ICE 5

This example reads a CSV file from a GitHub gist and displays summary statistics about its size and structure. The visualization first fetches the data using the D3 CSV parser, then calculates the total data size in kilobytes by formatting the content, and finally reports the row and column counts. The output is rendered as plain text within a black-styled HTML `<pre>` element. D3 v7 is used solely for CSV loading and formatting, while the page layout relies on basic HTML and CSS styling.

RRobFaj
88% 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
88% match
Loading thumbnail…

ICE5

This example displays metadata about a car evolution dataset covering 1945–2020, presented as text over a background image of a car. It shows the file size in kilobytes, row count, and column count of the loaded CSV data. The visualization uses D3 v7’s `d3.csv` to fetch and parse the external dataset, then `d3.csvFormat` to calculate its size. Styling is handled with CSS, including background positioning and text alignment. The page is built with plain HTML and JavaScript, without a React framework despite the metadata listing one.

Rrajkumarboddapati2
88% match
Loading thumbnail…

ICE5

This example displays metadata from a store dataset, including row count, column count, and file size, presented as text on a styled HTML page with a background image. It fetches a CSV file from a GitHub Gist using D3’s `d3.csv` function, then formats the data with `d3.csvFormat` and calculates its size in kilobytes. The visualization is rendered with plain HTML elements, including headings and a `<pre>` block, styled by a linked CSS file, and uses React only as a framework reference. The page relies on D3 v7 and JavaScript for data retrieval and message assembly.

SSravaniPosina
87% match
Loading thumbnail…

ICE 5: Loading and Parsing CSV Data with D3.js

This example demonstrates loading a CSV file of car data from a GitHub gist using D3.js version 7. It displays a summary message showing the file size in kilobytes, the number of rows, and the number of columns. The visualization uses D3’s `d3.csv()` to fetch and parse the remote data, then applies `d3.csvFormat()` to calculate its byte length. The result is rendered as plain text in a large `pre` element on an HTML page with CSS styling.

SSaiSreya1
87% match
Loading thumbnail…

ICE 5

This example presents a plain HTML table and summary statistics for a vehicles dataset loaded from a remote CSV file. The page displays the approximate size of the data in kilobytes, the number of rows, and the number of columns, followed by the full dataset in a styled table. It uses D3.js v7’s `d3.csv` to fetch and parse the data, then builds the table and summary text with string templates and D3’s selection API. The styling relies on standard CSS for the container, table, and hover states.

Ssaisathwikaguntupalli@gmail.com
87% match