Tooltip component triggered by mouse-over-series events. When mounted, the tooltip component
registers a mouse-over handler with the useMouse hook using the
UseMouseValues.registerMouseOverHandler function. The handler renders the tooltip
by adding it to the SVG plot container. However, to remain general, this Tooltip also
uses the useTooltip's UseTooltipValues.tooltipContentProvider to render the actual
content of the tooltip. The content provider is given the series' name on which the mouse-over
event occurred, the plot time associated with mouse-over event, and the TimeSeries
associated with the mouse-over event. The plot (for example ScatterPlot) is responsible
for rendering the tooltip, and it registers this tooltip-content provider with the useTooltip
hook.
The useChart hook allows the plots and this tooltip to register methods needed its siblings.
on mount
The plot (for example ScatterPlot) adds a d3 mouse-enter and mouse-leave event handlers
to each series. The mouse-enter event handler performs a few tasks and then calls the
mouse-over event handler registered by the Tooltip via the useMouse hook.
The plot (for example ScatterPlot) registers the tooltip-content provider with the useTooltip
hook using the UseTooltipValues.registerTooltipContentProvider function.
Tooltip registers the handler for mouse-over events. The handler accepts the series
name, plot time, and time-series associated with the mouse-over event, and returns the tooltip
dimensions. In order to create/render the tooltip, it uses the UseTooltipValues.tooltipContentProvider
function that was registered via the useTooltip hook.
on mouse-over event
When the plot's (for example ScatterPlot) d3 mouse-enter event handler fires, the plot calls this
Tooltip's mouse-over handler, which creates the tooltip, and calls the UseTooltipValues.tooltipContentProvider
registered by the plot to render the tooltip content, and get the tooltip size.
Tooltip component triggered by mouse-over-series events. When mounted, the tooltip component registers a mouse-over handler with the useMouse hook using the UseMouseValues.registerMouseOverHandler function. The handler renders the tooltip by adding it to the SVG plot container. However, to remain general, this Tooltip also uses the useTooltip's UseTooltipValues.tooltipContentProvider to render the actual content of the tooltip. The content provider is given the series' name on which the mouse-over event occurred, the plot time associated with mouse-over event, and the TimeSeries associated with the mouse-over event. The plot (for example ScatterPlot) is responsible for rendering the tooltip, and it registers this tooltip-content provider with the useTooltip hook.
The useChart hook allows the plots and this tooltip to register methods needed its siblings.
on mount
on mouse-over event
When the plot's (for example ScatterPlot) d3 mouse-enter event handler fires, the plot calls this Tooltip's mouse-over handler, which creates the tooltip, and calls the UseTooltipValues.tooltipContentProvider registered by the plot to render the tooltip content, and get the tooltip size.