VGraph 0.1.0
Graph Examples
Tutorials
Changelog
VChart Story Teller

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

VTable Checkered Artist

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.

VStory Data Story Framework

Intelligent visual storytelling, data story creation framework.

VSeed Data Seed

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

VGraph Relationship Explorer

It is not only a fully functional graph visualization library, but also an explorer of data relationships.

!!!###!!!title=Scroller——VisActor/VGraph tutorial documents!!!###!!!!!!###!!!description=The Scroller is a scrollbar component in vGraph used for scrolling, panning, and zooming the canvas. When this component is enabled, do not add `panZoom` and `dragCanvas` interactions simultaneously; related capabilities can be configured uniformly within the component.Here is an example of how to use the Scroller component. You can also try it out in the demo.```javascriptimport { Graph, Scroller} from "@visactor/vgraph";const scroller = new Scroller(graph, scrollerOptions );```!!!###!!!

Scroller

The Scroller is a scrollbar component in vGraph used for scrolling, panning, and zooming the canvas. When this component is enabled, do not add panZoom and dragCanvas interactions simultaneously; related capabilities can be configured uniformly within the component.

Here is an example of how to use the Scroller component. You can also try it out in the demo.

import { Graph, Scroller} from "@visactor/vgraph";
const scroller = new Scroller(graph, scrollerOptions );

Configuration

FieldTypeDescription
sizenumberThe size of the scrollbar style, in px. The default value is 10.
paddingnumber | number[]The padding value for the scrollbar at the graph's border. Defaults to 10. If set to undefined or null, the graph's padding will be used.
show'always' | 'hover'The display method for the scrollbar. Defaults to 'hover'.
dragCanvasboolean | Record<string, any>Whether to enable the dragCanvas interaction, defaults to true. You can also pass parameter configurations for the dragCanvas interaction.
panZoomboolean | Record<string, any>Whether to enable the panZoom interaction, defaults to true. You can also pass parameter configurations for the panZoom interaction.