activity 7.1

Aakitisaitejareddy@gmail.com

Activity-6

This example demonstrates basic D3.js and ES6 module usage within a VizHub project. It displays a large, centered "Hello VizHub!" message on a webpage, styled through an external CSS file. The code imports the `select` function from D3 and a custom `message` string from a local module, using `select('#message').text(message)` to set the text content. The page loads D3 version 5.16.0 from a CDN and relies on a pre-built `bundle.js` to execute the imported JavaScript.

Aakitisaitejareddy@gmail.com

Activity-6

Kkandulasunny17@gmail.com

Activity-6

This example demonstrates a minimal VizHub setup that displays the text “Hello VizHub!” centered on the page. It shows how to combine external libraries with local ES6 modules, loading D3 v5 from UNPKG and using its `select` function to update the DOM. The page also imports a custom message from a local `myMessage.js` module and applies styling via an external CSS file, illustrating basic project structure and modular code organization.

Bbhavanadupati3@gmail.com

Activity 7.1

This example demonstrates how to build a simple VizHub project by loading D3 v5 from a CDN and importing local ES6 modules. It displays the text “Hello VizHub!” centered in a large font using the `d3.select` API to set the content of an HTML div element. The code uses `import { select } from 'd3'` and a custom module `myMessage.js` to export the message string, showing basic module composition. The page is styled with a CSS file that centers the message and sets its font size. The visualization is minimal, focusing on tooling and module patterns rather than data rendering.

Jjaideeptripurani12@gmail.com

Activity_6

This example demonstrates a minimal VizHub project that displays a centered "Hello VizHub!" message using D3.js version 5 and local ES6 modules. The code imports the `select` function from the D3 library to query the HTML div element, and imports a custom message string from a local module through ES6 syntax. The page renders the text with a large font size defined in the accompanying CSS file, showcasing how to combine D3 selections, modular JavaScript, and styling in a simple visualization setup.

Activity 6

This example demonstrates a minimal D3.js setup within the VizHub environment, displaying the text "Hello VizHub!" centered on the page. The code imports the `select` function via an ES6 module from D3, and also imports a local custom message module. D3 v5 is loaded from UNPKG, and the example shows how to combine CDN libraries, local modules, and CSS styling in a simple single-page visualization.

Sskykarthik97@gmail.com

VVenkataSatyaRamKamini@my.unt.edu

Act 6.2

This example displays a simple web page with the text “Hello VizHub!” centered and enlarged via CSS. It demonstrates the basic workflow of a VizHub project by loading D3.js from a CDN and importing both a D3 API function and a local ES6 module. The code uses `select` from D3 to target a div element and sets its text content using a string exported from `myMessage.js`. The visualization itself is minimal, focusing on how D3 and local modules integrate within an HTML page.

Ssriyaalugupalli@my.unt.edu

Activity_6

This example renders a centered, large-font message reading “Hello VizHub!” on a plain webpage. It demonstrates fundamental VizHub workflows: loading D3.js via UNPKG, importing the `select` function from the D3 module, and importing a local ES6 module (`myMessage.js`) that exports the message string. The code uses `d3.select` to target the `#message` div and set its text content, while CSS styles control the font size and alignment. The visualization is static, showing a minimal integration of D3 with modular JavaScript and external stylesheets.