Skip to main content
SimilarExport ZIP
100%

Fork of Global Food Prices ICE-5

✓ Published0🌍 Public
KKeerthipriyaBankuru
Last edited Jun 22, 2022
Created on Jun 22, 2022

This fork of Global Food Prices ICE-5 displays a welcome message and a summary of a Top 100 actors dataset, including file size in kilobytes, row count, and column count. The page uses D3 v7’s `d3.csv` to fetch and parse the data from a GitHub Gist, then writes the statistics into a `<pre>` element. The visualization also embeds a static SVG image hosted on VizHub, and applies simple CSS styling with cyan and red background colors to the text elements.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Global Food Prices ICE-5

This visualization displays a welcome page for the ICE-5 data visualization exercise, showcasing a static SVG image of global food prices and a summary message about a dataset of the top 100 actors. The page loads data from a CSV file hosted on GitHub using the D3.js library version 7.3, specifically employing the `d3.csv` method to fetch and parse the data, then using `d3.csvFormat` to calculate its size. The resulting information—file size, row count, and column count—is displayed in a styled `<pre>` element, while a large heading and cyan background provide a bold visual aesthetic.

KKeerthipriyaBankuru
88% match
Loading thumbnail…

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

This visualization uses D3.js to load and summarize a CSV dataset of the top 100 actors. It fetches the data via `d3.csv` and displays a plain-text message indicating the file size in kilobytes, the number of rows, and the column count. The page also embeds an external SVG image and applies CSS styling for prominent headings and text. The chart focuses on conveying basic dataset metrics rather than complex graphical representations.

KKeerthipriyaBankuru
87% match
Loading thumbnail…

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

This example displays a welcome message and an SVG image on an HTML page, summarizing the top 100 actors dataset loaded from a CSV file. The page uses D3 v7 to fetch the data via `d3.csv`, then calculates and displays the file size in kilobytes, the number of rows, and the number of columns in a styled `<pre>` element. A static SVG image is embedded directly from a GitHub gist URL, while CSS styles the heading and message container with bold colors.

NNHRK555
85% match
Loading thumbnail…

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

This example displays a simple data summary for the Top 100 actors dataset, presenting the file size, row count, and column count in a styled `<pre>` element. It loads a remote CSV file using D3 v7’s `d3.csv` method, then computes the formatted string length with `d3.csvFormat` to estimate kilobytes. The page also embeds an SVG image directly. The visualization primarily serves as a lightweight demonstration of fetching and parsing tabular data, with basic CSS styling for typography and background colors, rather than a complex chart.

Aarchanagoli@my.unt.edu
85% match
Loading thumbnail…

Fork of ICE-5

This visualization displays a summary of the top 100 actors dataset, showing the number of rows, columns, and file size in kilobytes. The page presents this information in a large, styled text block alongside a static SVG image of a wall hanger. It uses D3 v7’s `d3.csv` to fetch and parse the remote CSV file, then employs `d3.csvFormat` to calculate the data size. The HTML includes custom CSS for colorful typography and inserts the image directly via an `<img>` tag.

SSaiSree0122
85% match
Loading thumbnail…

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

This example displays a simple data summary for the top 100 actors, presenting a message with the dataset’s size in kilobytes, row count, and column count. It uses the D3.js v7 library via `d3.csv` to load a remote CSV file and `d3.csvFormat` to calculate its textual length, while `textContent` updates the message container. The page also embeds a static SVG image, with styled headings and a large `<pre>` element for the output.

Sshreyasribearelly@gmail.com
85% 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
84% match
Loading thumbnail…

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

This example displays a welcome message for a data visualization project, summarizing the size and structure of a top-100 actors dataset loaded from a CSV file. It fetches the data using `d3.csv` and computes the formatted output length in kilobytes, row count, and column count, presenting these stats in a large centered `<pre>` element. The page also includes an externally hosted SVG image and applies CSS styling to headers and background colors. The visualization is minimal, focusing on preliminary data inspection rather than graphical representation.

PPYATA SHARAN
84% match