Skip to main content
SimilarExport ZIP
100%

Hello VizHub

✓ Published0🌍 Public
Bbobi0017
Last edited Jul 4, 2019
Created on Jul 4, 2019
Forked from Hello VizHub

This example demonstrates a minimal text-rendering setup in VizHub, showing how to display a static message with large, styled typography. The page loads D3 v5 from a CDN, imports a custom ES6 module (`myMessage.js`) that exports the string "Hello VizHub!", and writes that string into the DOM using `document.getElementById().textContent`. Styling comes from an external CSS file that sets a dark navy background, light text, and the Ubuntu font from Google Fonts. No data or interactive behavior is involved; the visualization is purely presentational.

AI-generated description

An example showing the capabilities of VizHub.

MIT Licensed

Similar vizzes

Loading thumbnail…

Hello VizHub

This example demonstrates a minimal text-rendering setup for a visualization gallery. It displays the static message “Hello VizHub!” in large, styled text against a dark background. The page uses D3 v5 for DOM manipulation, with an ES6 module (`myMessage.js`) exporting the message string, which is then injected into an HTML element via `document.getElementById`. Styling relies on Google Fonts’ Ubuntu typeface through CSS, while the HTML structure includes a preformatted element and a div for content.

Ffernandotsurukawa
94% match
Loading thumbnail…

Hello VizHub

This example demonstrates a simple text-based visualization that displays the message "Hello VizHub!" prominently on a styled webpage. It shows how a static string can be rendered with custom typography and color using HTML and CSS. The code uses D3 v5, specifically loading the library via a CDN script tag, while ES6 modules are implemented with an export in `myMessage.js` and an import in `index.js`. The rendering relies on standard DOM manipulation via text content, with styling applied through external CSS that includes a Google Fonts import.

Ssahabhabesh227
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates how the VizHub platform can be used to build a minimal interactive data-visualization page, showing static text rendered with large, centered styling. The visualization displays the message "Hello VizHub!" on a dark blue background with a custom Ubuntu font. The code uses D3 v5’s `select` method to target a `div` element and set its text content using a value imported from a separate ES6 module, `myMessage.js`. Styling is applied via an external CSS file that also imports a Google Font.

LLabin Ojha
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal D3.js visualization that displays a static text message, "Hello VizHub!", centered on a dark blue background with large, light-colored Ubuntu typography. It shows how to combine D3’s `select` API to target a DOM element and set its text content, while using an ES6 module (`myMessage.js`) to export the message string. The page relies on D3 v5, imported via the `d3` module, and styles the output with CSS, including a Google Fonts import. No data source or dynamic rendering is involved; the example focuses on basic DOM manipulation and modular code structure.

Sselina-rudolph
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal D3.js visualization that displays a static text message, "Hello VizHub!", centered on a dark blue background with large, light-colored Ubuntu typography. It shows how to combine D3’s `select` API to target a DOM element and set its text content, while using an ES6 module (`myMessage.js`) to export the message string. The page relies on D3 v5, imported via the `d3` module, and styles the output with CSS, including a Google Fonts import. No data source or dynamic rendering is involved; the example focuses on basic DOM manipulation and modular code structure.

Sselina-rudolph
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal D3.js visualization that displays a static text message, "Hello VizHub!", centered on a dark blue background with large, light-colored Ubuntu typography. It shows how to combine D3’s `select` API to target a DOM element and set its text content, while using an ES6 module (`myMessage.js`) to export the message string. The page relies on D3 v5, imported via the `d3` module, and styles the output with CSS, including a Google Fonts import. No data source or dynamic rendering is involved; the example focuses on basic DOM manipulation and modular code structure.

Sselina-rudolph
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal D3.js visualization that displays a static text message, "Hello VizHub!", centered on a dark blue background with large, light-colored Ubuntu typography. It shows how to combine D3’s `select` API to target a DOM element and set its text content, while using an ES6 module (`myMessage.js`) to export the message string. The page relies on D3 v5, imported via the `d3` module, and styles the output with CSS, including a Google Fonts import. No data source or dynamic rendering is involved; the example focuses on basic DOM manipulation and modular code structure.

Sselina-rudolph
93% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal “Hello VizHub” page, rendering a single text message using D3.js v5. The visualization sets the text content of a div element through D3's `select` and `.text` methods, importing the message string from a local ES6 module. Styling is handled via an external CSS file with a Google Fonts import, applying a large, centered Ubuntu font against a dark blue background. The code highlights basic D3 DOM manipulation, modular JavaScript imports, and external stylesheet integration in a simple, self-contained example.

Rross-fisher
93% match