Export Image
Export Code

Nigeria LGA map

Adekola Aliu

Last edited Sep 06, 2024
Created on Sep 06, 2024

Full course playlist:

VizHub Version 3: A New Era in Interactive Coding

Interactive Widgets: A Leap Forward in Real-Time Feedback

Simplifying the Entry Point: The Main Function

In a departure from traditional setups, VizHub version 3 does away with the need for an index.html file. Instead, the entry point is a main function exported from index.js. This function takes two arguments:

  • container: A DIV element that has measurable dimensions using clientWidth and clientHeight.
  • options: An object containing state and setState, where:
    • state is initialized as an empty object {} and stores the application's state.
    • setState is a function that can be called with a function to create a new state object using immutable update patterns.

A Blank Slate Starting Point: "Hello World" for VizHub V3

Learning Through Interaction: The Mouse Follower Example

For an interactive example of the capabilities of VizHub version 3, the Mouse Follower demonstration provides a hands-on experience. This example illustrates how developers can create dynamic visualizations that respond to user input, further highlighting the platform's emphasis on interactivity and real-time feedback.

A Humble Yet Powerful Tool

VizHub version 3 represents a humble yet powerful step forward in the world of interactive coding and data visualization. Its focus on real-time feedback, simplified entry points, and interactive examples aims to enhance the coding experience and make learning more accessible. While there is still much to explore and improve, this new version is a testament to the ongoing efforts to make data visualization more dynamic and engaging.

MIT Licensed