My Webpage

100%

✓ Published0🌍 Public

Last edited Jul 1, 2023

Created on Jul 1, 2023

This example demonstrates a webpage about cricket legend MS Dhoni, featuring a custom-designed SVG logo of a face and embedded text content. The page loads D3 v5 via UNPKG and uses the `d3.csv` function to fetch a remote CSV dataset from a Gist URL, displaying file size, row count, and column count in a message container. The visualization also imports `select`, `csv`, and `csvFormat` from D3 in the `index.js` file to append the first 10 data rows as formatted JSON text to the page body.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

My Webpage

This example demonstrates loading a CSV dataset from a GitHub gist and displaying its size in kilobytes, row count, and first ten rows as JSON in a webpage. It uses D3 v5’s `d3.csv` and `d3.csvFormat` APIs to fetch and measure the data, alongside local ES6 module imports from `index.js`. The page also features static HTML/CSS content and an embedded SVG graphic of a cricket-themed illustration.

VVenkat-Sumith-Thota

83% match

Loading thumbnail…

My Webpage

This example demonstrates loading and displaying a CSV dataset of student performance within a styled HTML page. Using D3 v5, it fetches data from a GitHub gist via `d3.csv`, then reports the file size in kilobytes, row count, and column count. A static SVG star graphic is included, alongside a second `d3.csv` call that prints the first ten rows as JSON. The page combines CSS styling, an HTML container, and D3's selection and formatting utilities.

VVarshareddy2912

81% match

Loading thumbnail…

My Webpage

This example shows a webpage that loads data from a remote CSV file using `d3.csv`, displaying the file's size, row count, and column count in a `<pre>` tag. The page also includes an SVG graphic and a static header. The code uses the D3 v5 library loaded via UNPKG, and an equivalent `index.js` demonstrates importing `csv`, `csvFormat`, and `select` from the `d3` module to parse and preview the first 10 rows of the Automobile dataset.

VVenkat-Sumith-Thota

80% match

Loading thumbnail…

My Webpage

This example demonstrates the loading and display of a CSV dataset from a GitHub Gist, showing file size, row count, and column count in a preformatted text container. The page combines basic HTML and CSS styling with D3.js v5, using the `d3.csv` API to fetch and parse the remote data asynchronously. The visualization also includes a simple inline SVG graphic with geometric shapes, and the code highlights VizHub's modular architecture through local ES6 module imports in separate JavaScript files.

Aakshayvenishetty1437

79% match

Loading thumbnail…

My Webpage

This example presents a personal webpage for Sai Krishna Bussa, featuring an embedded SVG logo, navigation, and an automatically generated table of car sales data. It demonstrates how HTML, CSS, and JavaScript work together in a React-less setup. The page loads a CSV file from a GitHub gist using D3 v5’s `d3.csv` method, then dynamically constructs the table by inserting header cells (`th`) and data cells (`td`) into the DOM. The SVG logo and styling are defined inline within the HTML and external `styles.css`.

Ssaikrishnabussa

78% match

Loading thumbnail…

My Webpage

A webpage displays a welcome message and an SVG logo alongside placeholder text, with a section linking to externally hosted CSV data and an empty table element intended for a data preview. The example demonstrates importing D3 functions via `select` from the UNPKG-hosted D3 library and using a local ES6 module (`myMessage.js`) to set the text of a `#message` div. The page’s styling is defined in CSS within the HTML file, while a separate `styles.css` file styles the message text in large, centered type.

VVenkat-Sumith-Thota

77% match

Loading thumbnail…

My Webpage

This example demonstrates how to embed a CSV data table directly into a webpage using the native Fetch API to load a remote file from a GitHub gist. It shows the first ten rows of parsed data displayed in an HTML table, with headers and cells populated dynamically through DOM manipulation. The page also includes basic HTML structure, a reference to an SVG logo image, and a link to a D3 version 6 tutorial video, though no D3 visualization is actually implemented. The code relies on standard browser APIs like `fetch` and `document.createElement` rather than any external charting library.

BBhavanaGIrni

74% match

Loading thumbnail…

My DataVisualization Practice D3

This example demonstrates a minimal web page that displays the text “Loading and Parcing CSV Data” in large, centered type. The page is built with a standard HTML5 document structure and uses inline CSS for styling, while an empty script tag suggests the intended use of JavaScript for data handling. The work relies on the D3.js library, though no specific functions or API calls are present in the provided code. The page serves as a static placeholder, indicating a future step of parsing CSV data for visualization.

DDeepa-hibot

72% match