CSCE-5320 ICE-5

100%

CSCE-5320 ICE-5

✓ Published0🌍 Public

Last edited Feb 25, 2022

Created on Feb 22, 2022

This example displays a static house illustration built with SVG shapes such as rectangles, lines, ellipses, and a path, layered over a light green lawn and blue roof. A React and D3 v7 setup loads CSV data from a GitHub gist, calculates the formatted data size in kilobytes, and reports the row and column counts in a message area. The page styling uses CSS to center content and apply a goldenrod background, while the SVG renders directly in the browser.

AI-generated description

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

Similar vizzes

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

83% match

Loading thumbnail…

CSCE-5320 data visualization ICE-5 assignment

This example displays a static SVG rectangle alongside a CSV data summary, reporting the file’s size in kilobytes, row count, and column count. The page uses D3 v5’s `d3.csv` and `d3.csvFormat` to fetch and parse the remote rich.csv file, then updates a `<pre>` element with the computed metadata. Styling via custom CSS and inline SVG shapes provides a simple visual context, while React is referenced in the project structure but not actively used in the rendering.

Cchandrakalavanukuri

82% match

Loading thumbnail…

Scientific Data Visualization ICE5

This example displays a simple house illustration, with a pink roof, a gray door and window, over a summary of a loaded dataset. The page combines an inline SVG graphic with a text output that reports the dataset’s size in kilobytes, row count, and column count. The code uses D3.js version 7 to fetch a CSV file from a GitHub gist, parse it with `d3.csv`, and compute the formatted length via `d3.csvFormat`. The visualization is built with React, rendering the SVG and the JavaScript-generated message.

SSravyaAnnadi

82% match

Loading thumbnail…

CSCE-5320 ICE-5

This example demonstrates how to load and parse a remote CSV dataset using D3.js v5 within a simple HTML page styled with custom CSS. The page displays a light green SVG polygon and a heading, while a JavaScript script fetches the CSV from a GitHub Gist, calculates its size in kilobytes, row count, and column count, and prints this summary inside a styled `<pre>` element. The code uses `d3.csv` for data retrieval and `d3.csvFormat` to measure the data length, with the result presented as a plain text message on a goldenrod background.

LLG0498

81% match

Loading thumbnail…

ICE-5

This example displays a large red and yellow message about cricket data alongside a static SVG house image. Using d3.csv, it fetches a remote CSV file, calculates its size in kilobytes with d3.csvFormat, and counts its rows and columns. The resulting summary appears as plain text in a pre element, styled by CSS. The visualization emphasizes the data-loading process over any graphical mapping, serving as a minimal demonstration of D3 version 7 in a React-hosted HTML page.

SSweetierams

81% 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

80% match

Loading thumbnail…

11525657_ICE5

This example demonstrates basic data loading and parsing with D3. It fetches a CSV file from a GitHub gist using `d3.csv`, then displays the file size, row count, and column count in a large, styled text element. A static ornamental SVG image is also embedded on the page. The visualization uses D3 v7 within a plain HTML page, with styling applied via CSS to highlight the parsed data summary.

BBVNPK001

78% match

Loading thumbnail…

Data Visualization ICE5

This example presents a dashboard of static vector illustrations—a house and a human figure—rendered as inline SVG paths. The page also reports basic statistics about a cricket dataset loaded from a GitHub gist, including its size in kilobytes, row count, and column count. The visualization uses the D3.js library to fetch and parse the CSV data with `d3.csv`, while the SVG artwork is embedded directly in the HTML. The interface is built with plain HTML and CSS, and the figure images are referenced as separate SVG files.

TTharun2022

78% match