Skip to main content
SimilarExport ZIP
100%

Ice

✓ Published0🌍 Public
PPavaniMangugari
Last edited Jun 22, 2022
Created on Jun 21, 2022
Forked from HTML Starter

This example displays a fixed, decorative SVG illustration of a snowman-like figure composed of basic shapes, overlaid on a pastel background with a yellow star. Below the graphic, a message reports the size and structure of a dataset loaded from a remote CSV URL of 48 countries’ capitals. The code uses the D3.js v7 library’s `d3.csv` method to fetch and parse the data, and `d3.csvFormat` to calculate its size, updating a `<pre>` element with row and column counts.

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

This example displays a static SVG illustration of a map-like shape alongside a table of U.S. state population data. The visualization loads a CSV file from a GitHub gist using `d3.csv` and reports the dataset’s size, row count, and column count in a text element. All rendering occurs in SVG within a React framework, with minimal styling applied via CSS.

PPavaniMangugari
85% match
Loading thumbnail…

ICE 5

This example displays a hand-drawn SVG snowflake in the center of the page, along with a title, author name, and a message about the loaded data. The page uses D3 v7 to fetch a CSV file containing a houses dataset, then formats the data to display its size in kilobytes, row count, and column count. The SVG is rendered as a static image, while the data summary appears in a styled `<pre>` element, demonstrating D3’s `d3.csv` and `d3.csvFormat` functions for data loading and inspection.

Vvegurusaiprathyusha
84% match
Loading thumbnail…

ICE 5

This example displays a static SVG graphic alongside a text summary of a remote CSV dataset. The page uses D3 v5’s `d3.csv` method to fetch the data and calculates the file size in kilobytes, row count, and column count, which are then displayed in a `<pre>` element. A fixed-size SVG placeholder and an embedded PNG image are shown, with page styling handled by CSS.

Cchandanagandla
82% match
Loading thumbnail…

ICE5

This example displays a static SVG illustration of a whimsical landscape, including a house, sun, and decorative stars, with a header that confirms the loading of phrase data. It uses D3 v7 to fetch and parse a CSV file from a GitHub gist, then calculates and displays the data’s size, row count, and column count in a styled `<pre>` element. The visualization combines hardcoded SVG shapes with dynamic data summary text, showing how D3’s `d3.csv` and `d3.csvFormat` can be used to introspect dataset properties while the rendering relies on React’s DOM and SVG elements.

RRakesh Kumar Chekuri
82% match
Loading thumbnail…

ICE5 - chaturya d3.js parsing

This example shows a winter-themed SVG scene featuring a snowman built from geometric shapes, alongside a text panel that displays debug information about a CSV file. The visualization uses D3.js v7 to parse a remote CSV dataset of CSS colors via `d3.csv`, then reports the file size, row count, and column count in the DOM. The snowman is constructed entirely with SVG primitives—circles, rectangles, and polygons—appended through D3 selections, with styling controlled by CSS classes. The page also includes decorative elements like clouds and a river, all rendered within an 800×600 SVG viewport.

CChaturyaAkhilaPallem@my.unt.edu
81% match
Loading thumbnail…

ICE-5 (Loading and Parsing CSV Data with D3.js)

This example loads a CSV file of corona data using D3.js and displays a summary of its size and structure. The page fetches data from a GitHub gist with `d3.csv`, then uses `d3.csvFormat` to measure the data size in kilobytes, reports the row count, and lists the number of columns. The result is rendered as styled text in an HTML `<pre>` element, alongside a static inline SVG illustration of a snowman figure. The visualization demonstrates basic CSV parsing and text-based output rather than graphical charting.

AAashish Pandey
81% match
Loading thumbnail…

ICE-5

This example combines a manually drawn SVG scene with a data-loading demonstration using D3 v7. The static illustration features a gradient sky, dark red panels, and black circles, while a heading and a preformatted text block display metadata about the loaded file. The code calls `d3.csv()` to fetch a remote CSV file, then uses `d3.csvFormat()` to compute its size, row count, and column count for display.

AAishwarya Manjunath
81% match
Loading thumbnail…

ice-5

This example displays a custom SVG illustration of a stylized landscape, featuring a large decorative arch, circular shapes, and two bucket-like icons connected by a horizontal rail. The page also presents basic metadata about a CSV dataset, including its size in kilobytes, row count, and column count, which is loaded from a GitHub gist. The visualization is built using React and rendered with SVG, while the data summary is generated using D3 v7’s `d3.csv` and `d3.csvFormat` methods. The layout is styled with embedded CSS, using simple color blocks and headers.

Ssowmyanagula@my.unt.edu
80% match