Skip to main content
Log in
Y

Yehui Wang

@eyehwan·9 public vizzes

Loading thumbnail…

Untitled

This example demonstrates a full-screen numerical counter rendered in large, bold Ubuntu type on a dark navy background. The page imports a custom module, `myMessage.js`, to provide the displayed content, and uses the imported `index.js` to manage the application logic. Styling is handled through an external stylesheet, `styles.css`, which sets the body’s background color, text alignment, and font size. The visualization is minimal yet effective, showcasing how VizHub projects can combine modular JavaScript files with global CSS to create a simple, striking display.

Dec 15, 2019
Loading thumbnail…

Untitled

This example demonstrates how to display a dynamic text message at a massive scale, rendering the word “Hello!” in a bold, centered layout using HTML, CSS, and JavaScript. It imports a message string from a separate module and injects it into the DOM, while a custom Google Font (Ubuntu) and a dark navy background create a striking visual contrast. The styling uses CSS variables and flexbox for alignment, and the code relies on basic DOM manipulation and fetch-free ES module imports to keep the structure simple and readable.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example displays a static, full-page “Hello VizHub!” message in large Ubuntu type on a dark navy background, demonstrating VizHub’s basic project structure. It uses D3 v5’s `select` method to set the text of a `div` element, pulling the string from an exported ES6 module (`myMessage.js`). The styling relies on an external Google Fonts import and plain CSS. The visualization is purely textual, showcasing how D3, JavaScript modules, and CSS combine in a minimal single-file setup.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example displays a static, full-page “Hello VizHub!” message in large Ubuntu type on a dark navy background, demonstrating VizHub’s basic project structure. It uses D3 v5’s `select` method to set the text of a `div` element, pulling the string from an exported ES6 module (`myMessage.js`). The styling relies on an external Google Fonts import and plain CSS. The visualization is purely textual, showcasing how D3, JavaScript modules, and CSS combine in a minimal single-file setup.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example shows a simple text-based visualization: the phrase “Hello VizHub!” displayed prominently in large Ubuntu font against a dark blue background. It demonstrates the minimal setup required for a D3 project in VizHub, using D3’s `select` method to set the text content of an HTML div. The message is imported from a separate ES6 module, and styling is handled entirely via CSS with an external Google Fonts import.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example displays a static, full-page “Hello VizHub!” message in large Ubuntu type on a dark navy background, demonstrating VizHub’s basic project structure. It uses D3 v5’s `select` method to set the text of a `div` element, pulling the string from an exported ES6 module (`myMessage.js`). The styling relies on an external Google Fonts import and plain CSS. The visualization is purely textual, showcasing how D3, JavaScript modules, and CSS combine in a minimal single-file setup.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example demonstrates a simple text-based visualization that displays the message "Hello VizHub!" in large, centered Ubuntu font on a dark blue background. It uses D3.js v5’s `select` method to target a `div` element and set its text content from an imported ES6 module. The page structure is defined in `index.html`, while styling and interactivity are handled through external CSS and JavaScript files. The code showcases basic module imports and D3’s DOM manipulation capabilities.

Dec 15, 2019
Loading thumbnail…

Hello VizHub

This example shows a simple text-based visualization: the phrase “Hello VizHub!” displayed prominently in large Ubuntu font against a dark blue background. It demonstrates the minimal setup required for a D3 project in VizHub, using D3’s `select` method to set the text content of an HTML div. The message is imported from a separate ES6 module, and styling is handled entirely via CSS with an external Google Fonts import.

Dec 15, 2019
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 page with large, styled typography. It shows how to integrate D3 with ES6 modules and external CSS. The code uses `d3.select` and the `.text` method to set the content of a `div` element, while `myMessage.js` exports the string as a module. The `index.html` loads D3 v5 and the compiled `bundle.js`, with styling provided by `styles.css`.

Dec 15, 2019