# yyhsong/idatav **Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/yyhsong-idatav).** 5,689 stars · 1,607 forks · JavaScript ## Links - GitHub: https://github.com/yyhsong/iDataV - Homepage: https://yyhsong.github.io/iDataV - awesome-repositories: https://awesome-repositories.com/repository/yyhsong-idatav.md ## Topics `antv` `data-visualization` `datav` `echarts` `large-screen-data-visualization` `sugar` ## Description iDataV is a big-screen data visualization dashboard builder that combines bar, line, pie, map, and number-flip charts into a single large-format display. It provides a canvas-based rendering engine for high-performance chart drawing, a CSS Grid layout engine for responsive dashboard arrangements, and flip-digit animations for numeric indicators. The project includes template-based project scaffolding for generating new dashboards from pre-built HTML, CSS, and JavaScript templates. The tool offers prebuilt dashboard demos for scenarios such as tourism, sales, stock markets, cloud monitoring, and retail, along with a stock market overview visualization that displays key statistics like listed companies, market capitalization, and P/E ratios. It supports sunburst hierarchical rendering for multi-layer ring charts, tab-switching view controllers for cycling through different data views, and static data injection from inline JSON objects or external files without requiring a backend server. The platform enables multi-chart layout rendering in a fixed grid, key metrics display for at-a-glance summaries, and dashboard template customization to adapt to specific data sources and visual needs. It also provides a tabbed dashboard builder for organizing multiple chart panels into switchable views. ## Tags ### Graphics & Multimedia - [Big Screen Visualization Frameworks](https://awesome-repositories.com/f/graphics-multimedia/big-screen-visualization-frameworks.md) — Combines bar, line, pie, map, and number-flip charts into a single large-screen data visualization project. ([source](https://cdn.jsdelivr.net/gh/yyhsong/idatav@master/README.md)) - [CSS Grid Panel Layouts](https://awesome-repositories.com/f/graphics-multimedia/video-scene-layouts/grid-arrangements/css-grid-panel-layouts.md) — Arranges chart components in a fixed grid using CSS Grid for responsive big-screen layouts. - [Fixed Grid Dashboard Arrangements](https://awesome-repositories.com/f/graphics-multimedia/visualization-mapping/composite-visualizations/mixed-chart-types/multi-chart-type-libraries/report-canvas-chart-arrangers/fixed-grid-dashboard-arrangements.md) — Arranges bar, line, pie, map, and number-flip charts in a fixed grid to tell a comprehensive data story. - [Number Flip Animations](https://awesome-repositories.com/f/graphics-multimedia/media-production-suites/animation-tools/programmatic-animation-apis/state-transition-animators/flip-animations/flip-style-clock-animations/number-flip-animations.md) — Ships a number-flip animation module for animating numeric indicators with a flip-digit effect. ### Part of an Awesome List - [Multi-Chart Visualization Tools](https://awesome-repositories.com/f/awesome-lists/data/charts-and-visualization/multi-chart-visualization-tools.md) — Combines bar, line, pie, and map charts into a single large-screen visualization project. ### User Interface & Experience - [Fixed Grid Arrangements](https://awesome-repositories.com/f/user-interface-experience/chart-layout-components/fixed-grid-arrangements.md) — Arranges several chart components in a fixed grid to present a comprehensive data story on a single screen. ([source](https://yyhsong.github.io/iDataV/tpl05/index.html)) - [HTML5 Canvas Charting Libraries](https://awesome-repositories.com/f/user-interface-experience/data-visualization-tools/data-visualization/charting-frameworks/html5-canvas-charting-libraries.md) — Renders bar, line, pie, and map charts directly on HTML5 Canvas for high-performance visualization. - [Dashboard Metric Displays](https://awesome-repositories.com/f/user-interface-experience/numeric-value-displays/dashboard-metric-displays.md) — Shows prominent numeric indicators alongside charts to give an at-a-glance summary of critical data points. ([source](https://yyhsong.github.io/iDataV/tpl05/index.html)) - [Template-Based Customizations](https://awesome-repositories.com/f/user-interface-experience/dashboards-and-homepages/dashboard-customizations/template-based-customizations.md) — Enables starting from pre-built dashboard templates and adapting them to specific data sources and visual needs. ([source](https://cdn.jsdelivr.net/gh/yyhsong/idatav@master/README.md)) - [Tabbed Interfaces](https://awesome-repositories.com/f/user-interface-experience/tabbed-interfaces.md) — Organizes multiple chart panels into switchable tabs for cycling through different data views. - [Dashboard Tab Navigations](https://awesome-repositories.com/f/user-interface-experience/tabbed-navigation/dashboard-tab-navigations.md) — Organizes chart panels into switchable tabs so viewers can cycle through different data views without leaving the screen. ### Data & Databases - [Market Overview Dashboards](https://awesome-repositories.com/f/data-databases/data-visualization-charts/financial-market-visualizers/market-overview-dashboards.md) — Displays key stock market statistics such as number of listed companies, total market capitalization, and average P/E ratios. ([source](https://yyhsong.github.io/iDataV/case09/index.html)) - [Prebuilt Examples](https://awesome-repositories.com/f/data-databases/data-visualization-dashboards/prebuilt-examples.md) — Offers prebuilt dashboard demos for tourism, sales, stock markets, cloud monitoring, and retail scenarios. ([source](https://yyhsong.github.io/iDataV/)) - [Stock Market Dashboards](https://awesome-repositories.com/f/data-databases/market-data-providers/stock-market-dashboards.md) — Provides a prebuilt dashboard that visualizes stock market statistics including listed companies, market capitalization, and P/E ratios. - [Sunburst Charts](https://awesome-repositories.com/f/data-databases/sunburst-charts.md) — Implements sunburst hierarchical rendering for multi-layer ring charts showing parent-child relationships. ### Development Tools & Productivity - [Template-Based Project Scaffolders](https://awesome-repositories.com/f/development-tools-productivity/project-templates/template-based-project-scaffolders.md) — Generates new dashboard projects by cloning and customizing pre-built HTML/CSS/JS template files. ### Programming Languages & Runtimes - [Ring Chart Visualizers](https://awesome-repositories.com/f/programming-languages-runtimes/programming-utilities/data-structure-type-helpers/data-structures/hierarchical-tree-structures/hierarchical-tree-visualizers/ring-chart-visualizers.md) — Renders multi-layer ring charts to show parent-child relationships in hierarchical datasets. ### Web Development - [Dashboard Tab Controllers](https://awesome-repositories.com/f/web-development/browser-integration-utilities/browser-session-management/tab-management/tab-lifecycle-controllers/dashboard-tab-controllers.md) — Provides a tab-switching view controller for cycling through different chart panels within a dashboard. - [Tabbed View Builders](https://awesome-repositories.com/f/web-development/report-designers/drag-and-drop-builders/dashboard-builders/tabbed-view-builders.md) — Organizes multiple chart panels into switchable tabs so viewers can cycle through different data views. ([source](https://yyhsong.github.io/iDataV/tpl05/index.html))