Introduction #
DataV is a Vue component library designed for large-screen digital visualization, providing flip cards, progress pools, number scrolling, flyline maps, and other common large-screen effect components. SmartChart has built-in DataV support in advanced settings.
Enable DataV mode in Advanced Settings
Reference videos:
DataV documentation: Charts
Common DataV Components #
| Component | Tag | Usage |
|---|---|---|
| Flip Text | <dv-flip-text> |
Number/text scroll display, ideal for KPI metrics |
| Count To | <dv-count-to> |
Number dynamic growth effect |
| Percent Pond | <dv-percent-pond> |
Percentage progress display |
| Active Ring Chart | <dv-active-ring-chart> |
Auto-rotating ring chart |
| Water Level Pond | <dv-water-level-pond> |
Water level percentage visualization |
| Flyline Chart | <dv-flyline-chart> |
Traffic flylines on map |
| Border | <dv-border-box-n> |
Digital screen decorative borders (n=1~13) |
| Decoration | <dv-decoration-n> |
Screen decoration lines (n=1~12) |
DataV mode must be enabled in Advanced Settings, system auto-loads corresponding JS/CSS DataV removed in v8.0, need to load JS manually