Fork of activity_6_task2

100%

Fork of activity_6_task2

✓ Published0🌍 Public

Last edited Apr 10, 2024

Created on Apr 10, 2024

This example demonstrates the fundamental workflow of VizHub, showing how a project imports D3 via UNPKG and local ES6 modules. The code uses D3’s `select` function to target the `#message` div and set its text content to “Hello VizHub!”, while the message itself is imported from a separate local module. The page layout is styled with CSS, centering the text at a large font size. It serves as a minimal, clear template for combining external library imports, modular JavaScript, and styling in a single visualization gallery entry.

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…

Fork of activity6_task3

This example demonstrates a minimal VizHub project that loads D3 via UNPKG and uses local ES6 modules. It imports the `select` function from D3 to set the text of a `#message` div to "Hello VizHub!", showing how to combine library imports with custom module code. The page uses a simple CSS stylesheet to center and enlarge the text, and includes a regular expression constant. The code shows the basic structure of importing from both D3 and a local file, with the message rendered using `select('#message').text(message)`.

Sshivasaiamaravadi@gmail.com

94% match

Loading thumbnail…

Fork of Activity 7

This example demonstrates the fundamental workflow of a VizHub project, showing how to combine D3.js with local ES6 modules to manipulate the DOM. It loads D3 v5 from UNPKG and uses the `select` function from the `d3` namespace to set the text content of an HTML element. A separate local module named `myMessage.js` exports a string, which is imported and displayed in the page. The visualization is purely text-based, with styling applied through CSS to center the message at a large font size.

Rruchithakakarla336@gmail.com

91% match

Loading thumbnail…

Fork of Activity6_task4 question

This example demonstrates how to import and use D3 v5 and local ES6 modules within a VizHub project. It renders the text “Hello VizHub!” into a div element using the `select` function from D3, while the message content is exported from a separate `myMessage.js` module. The page also defines a constant and a regular expression in the main script, and applies centered 12em font styling via an external CSS file. The code illustrates basic module bundling and D3 DOM manipulation.

Iiftequaruddin883@gmail.com

91% match

Loading thumbnail…

Activity6_Task3

This example demonstrates how VizHub enables a minimal D3.js project to load external libraries and utilize local ES6 modules. The page displays the text "Hello VizHub!" centered on the screen, styled via CSS. The code imports the `select` function from D3 to target the `#message` element and sets its text content. A separate local module, `myMessage.js`, exports the string used as the message, showcasing modular code organization within the template. The example uses D3 v5 loaded from UNPKG and relies on a bundled JavaScript file for execution.

Ppaulphillips@my.unt.edu

91% match

Loading thumbnail…

Fork of Activity7_Task 1

This example demonstrates the fundamental workflow of a VizHub project, showing how to import and utilize functions from external libraries within a React-based visualization environment. The code initializes a D3.js selection using the `select` API to target a DOM element, and also imports a custom message from a local ES6 module. The page renders a large, centered text message, with custom CSS styling applying a Poppins font and color scheme. The visualization serves primarily as a technical demonstration of D3 v5 integration through UNPKG and the use of modular JavaScript imports.

HHarshita Vairagade

91% match

Loading thumbnail…

Activity-6_task_1

This example demonstrates how to import D3.js and local ES6 modules within a VizHub project. It uses D3’s `select` function to set the text content of a `#message` div, displaying “Hello VizHub!”. The page loads D3 v5 from UNPKG via a script tag in `index.html`, while `index.js` pulls in `select` from the `d3` package and a custom `message` constant from `myMessage.js`. Styling is applied through an external CSS file, showing a minimal modular setup.

HHarinathChakali33@gmail.com

91% match

Loading thumbnail…

Fork of Activity-6

This example demonstrates how to load D3 via UNPKG and use ES6 modules to organize code in a minimal VizHub project. The page displays “Hello VizHub!” in large, centered text, styled with CSS. The code imports the `select` function from the `d3` namespace to manipulate the DOM, and imports a local `message` string from a separate ES6 module, showing how to combine external libraries with modular JavaScript. The implementation also includes a regular expression and a numeric constant to illustrate basic variable declarations.

Vvrushikarao03@gmail.com

90% match

Loading thumbnail…

Activity6_Task4_q1

This example demonstrates a basic D3.js setup within VizHub, showing how to import modules from both D3 and local ES6 files. It uses the `select` API from D3 v5 to target a `#message` div and update its text content. The text itself comes from a local `message` variable exported by a separate module, while the page loads D3 via UNPKG and links an external stylesheet. The visualization simply renders a static, centered text message using CSS for styling.

Vvemurisuchitha@gmail.com

90% match