Skip to main content
SimilarExport ZIP
100%

loading data

✓ Published3🌍 Public
Nnexus1058
Last edited Jan 23, 2021
Created on Jan 23, 2021
Forked from Hello VizHub

This example demonstrates how to load D3.js from a CDN and use local ES6 modules within a VizHub project. The visualization displays the text "Hello VizHub!" centered in the browser window by utilizing the `d3.select` API to target the `#message` div and set its text content. The code also imports a string from a separate local module, `myMessage.js`, and applies styling from an external `styles.css` file, showcasing a minimal setup for combining external libraries with modular code.

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…

Working with data

This example demonstrates the fundamental capabilities of VizHub, showing how to load D3 via a CDN and combine it with local ES6 modules. It imports the `select` function from D3 to set the text content of a div element, using a message string exported from a separate `myMessage.js` module. The rendered output is a single centered line of text, "Hello VizHub!", displayed at a large font size via CSS. The code highlights both external library integration and modular JavaScript organization within a visualization environment.

Ssangar-si
91% match
Loading thumbnail…

Fork of loading data

This example demonstrates how VizHub projects can load external libraries and organize code into reusable modules. It loads D3 v5 from UNPKG and uses the `select` function to target a `div#message` element, setting its text content from a locally imported ES6 module. The `myMessage.js` file exports a simple string, while `styles.css` centers the text in a twelve-em font size. The result is a minimal hello-world that shows D3’s import syntax and local module architecture.

Nnexus1058
89% match
Loading thumbnail…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
87% match
Loading thumbnail…

Hello VizHub

This example demonstrates how to set up a minimal D3.js visualization using ES6 modules. It loads D3 v5 from a CDN and uses `select` to target a `div` element, setting its text content to a string imported from a local module. The example shows the basic workflow of importing both external and local JavaScript modules, with styling handled by a separate CSS file that centers the message and sets a large font size.

Jjmanahan12
87% match
Loading thumbnail…

Hello VizHub

This example demonstrates a minimal D3.js setup within VizHub, displaying the text “Hello VizHub!” centered in the page. It loads D3 v5 from UNPKG and uses the `select` API to target the `#message` div, setting its content from a local ES6 module. The code imports a custom `message` constant from `myMessage.js` and applies styling via an external CSS file. The visualization shows how to combine CDN-hosted libraries with modular JavaScript imports.

Mmanchuran
87% match
Loading thumbnail…

Hello VizHub

A minimal example demonstrates the core capabilities of VizHub, showing how a web page can combine a local stylesheet, a D3 library loaded from a CDN, and imported ES6 modules. The visualization renders the text "Hello VizHub!" centered on the page using a large font. The code imports the `select` function from `d3` to target the `#message` div and set its text content from a separate local module. The example illustrates modular code organization and dependency management within a single project.

Aanduskong
87% match
Loading thumbnail…

D3 tutorial

This example demonstrates how to set up a minimal D3.js visualization within VizHub, using ECMAScript modules for code organization. It loads D3 v5 from UNPKG and displays a static text message, “Hello VizHub!”, centered in the browser via the `select` API and the `#message` div. The code imports `select` from D3 and a local `message` string from an ES6 module, then applies the text with D3’s selection method. Styling is handled through an external CSS file, showing a basic integration of local assets with a CDN-loaded library.

EEDPnajmi
86% match
Loading thumbnail…

TD Hello VizHub

This example demonstrates how to structure a minimal D3.js visualization project in VizHub, displaying the text “Hello VizHub!” in a large, centered font. It shows a complete workflow: loading D3 from a CDN, importing individual `select` from the D3 library, and using a local ES6 module (`myMessage.js`) to supply the text content. The code relies on the `d3.select` API to target a `div#message` element and set its text, while CSS handles the styling. No data manipulation or computing is involved; the focus is on module imports and embedding D3 efficiently.

TTatjana Dzambazova
86% match