{"version":"1.0","type":"rich","title":"d3Edge_v5ProReusable_HelloWord-Ch3.1","description":"This example demonstrates a reusable chart component built with D3.js v5 following the ProD3 pattern, displaying a static \"Hello World\" message derived from input data. The code defines a custom module, `d3.edge.table`, which encapsulates chart configuration through setter methods like `.fontSize()` and `.fontColour()`, and renders text into a designated DOM element. It also implements a custom event dispatcher via `d3.dispatch`, broadcasting a `'customHover'` event on mouseover. The chart is instantiated and applied to a selection using `.call(Table)`, showing a simple yet modular approach to building interactive, configurable D3 components.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/8b450fd5d973452d83132b853b3f16a7?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}