27-How to customize the mounting node of the tooltip component in VChart—

Not only an out-of-the-box multi-terminal chart library, but also a vivid and flexible data storyteller.

Not only a high-performance multi-dimensional data analysis form, but also a grid artist created between rows and columns.

VGrammar Data Magician

It is not only a visual grammar that generates thousands of charts, but also a data magician who turns boring into magic.

VRender Visual Rendering

Not only a visual rendering engine with rich functions, but also a handy pen.

VMind Smart Visualization Suit

Not just automatic, but also fantastic.

VStory Data Story Framework

Intelligent visual storytelling, data story creation framework.

VSeed Data Seed

VSeed, an elegant data composer, transforming complexity into simplicity.

!!!###!!!title=27-How to customize the mounting node of the tooltip component in VChart——VisActor/VChart FAQ documents!!!###!!!

Question Description

Does VChart's tooltip support changing the mount node? For example, hanging in a chart container or elsewhere?

Solution

VChart's tooltip spec has a dedicated configuration item called parentElement, which supports passing in HTMLElement objects or strings (representing node ids) to meet the requirements. The following is an example of mounting tooltip to a chart container:

Code Example

Result

Quote

github：https://github.com/VisActor/VChart

option docs: https://www.visactor.io/vchart/option/barChart#tooltip.parentElement

How to customize the mounting node of the tooltip component in VChart?