Add the SurveyJS white-label form builder to your JavaScript app (React/Angular/Vue3). Build complex JSON forms without coding. Fully customizable, works with any backend, perfect for data-heavy apps. Learn more. Learn more →
Top 23 TypeScript Data Visualization Projects
-
Grafana
The open and composable observability and data visualization platform. Visualize metrics, logs, and traces from multiple sources like Prometheus, Loki, Elasticsearch, InfluxDB, Postgres and many more.
Project mention: Grafana 12 just leveled up observability as code and dashboards that think | dev.to | 2025-05-17GitHub repo
-
SurveyJS
JavaScript Form Builder with No-Code UI & Built-In JSON Schema Editor. Add the SurveyJS white-label form builder to your JavaScript app (React/Angular/Vue3). Build complex JSON forms without coding. Fully customizable, works with any backend, perfect for data-heavy apps. Learn more.
-
echarts
Apache ECharts is a powerful, interactive charting and data visualization library for browser
Note: a website may use more than one web server
5 months using Apache Echarts and watch GitHub repository https://github.com/apache/echarts for all activities. The developer team enthusiasm and unity is impressive. It is flexible, powerful, constantly improved and plenty of examples.
-
PixiJS
The HTML5 Creation Engine: Create beautiful digital content with the fastest, most flexible 2D WebGL renderer.
To improve performance, another team built a POC replacing standard DOM elements with a canvas managed by a library called pixi.js. The idea was to boost rendering speed.
-
Directus
The flexible backend for all your projects 🐰 Turn your DB into a headless CMS, admin panels, or apps with a custom UI, instant APIs, auth & more.
It seems to really be an ad for Directus (https://directus.io/) (?)
-
Open Source Alternatives - For those who prefer open-source tools, libraries like SVG.js and Fabric.js offer customizable, canvas-based design functionality that can be integrated into web applications. These tools are free to use, offering high flexibility, though they may require significant development effort.
-
Project mention: Demystifying npm package installation: Insights, analysis and optimization tips | dev.to | 2025-04-22
In order to run each scenario, there must be a package.json file present. For this analysis, we will use the following package.json file. This is a real package.json file, that I've used when creating a simple demo of Recharts library.
-
BabylonJS
Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
-
InfluxDB
InfluxDB – Built for High-Performance Time Series Workloads. InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.
-
Visx is built for React, so it seamlessly integrates with React applications. Its architecture aligns with React's component-based approach, allowing developers to leverage React's state management and lifecycle methods for building dynamic and interactive visualizations.
-
Bokeh is another library focused on interactive visualizations. It’s designed to handle large datasets and create interactive plots and dashboards. It’s ideal for applications that require user interaction and real-time data updates.
-
-
Project mention: Data Visualization: How to Create Styled Cryptocurrency Candlesticks with Highcharts | dev.to | 2024-12-28
Install Highcharts via NPM and import as modules. These are best for Single Page Applications like React and Vue.
-
Project mention: Ask HN: What is the best software to visualize a graph with a billion nodes? | news.ycombinator.com | 2024-08-02
-
Occasionally, I saw an article named "Why do cats...?", which analyzed some preferences and behaviors of cats. The visual design in it attracted me very much. Its feature was the use of hand-drawn style and bubble-like layout. Besides, the lovely font was also pleasing. I like cats very much. I have a cat named Guagua (meaning cute and silly). Similarly, I am a front-end developer. I developed a graph visualization framework named AntV G6. Therefore, I thought I could achieve a similar design through this framework, and it turned out that I did!
-
Link : https://commerce.nearform.com/open-source/victory
-
-
-
-
React ChartJS 2 Documentation - https://react-chartjs-2.js.org/
-
Project mention: Interview with Microsoft SandDance Creator Steven Drucker | news.ycombinator.com | 2024-08-29
-
-
-
-
Project mention: Vega – A declarative language for interactive visualization designs | news.ycombinator.com | 2024-08-23
- RATH: Automation of data exploration workflow with one click. https://github.com/Kanaries/Rath
-
SaaSHub
SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives
NOTE:
The open source projects on this list are ordered by number of github stars.
The number of mentions indicates repo mentiontions in the last 12 Months or
since we started tracking (Dec 2020).
TypeScript Data Visualization discussion
TypeScript Data Visualization related posts
-
Letting Agents Write and Review Code — A 0dev Milestone(Demo)
-
A new way to make graphs more accessible to blind and low-vision readers
-
Canva API: A Comprehensive Guide
-
Python for Data Visualization: Best Tools and Practices
-
10 of the Best Web Analytics Tools for React Websites
-
How to Build an Internal Data Application Using Google Sheets as a Data Source
-
[Practical] Create a Dynamic Infographic in 10 Minutes
-
A note from our sponsor - SurveyJS
surveyjs.io | 20 May 2025
Index
What are some of the best open-source Data Visualization projects in TypeScript? This list will help you:
| # | Project | Stars |
|---|---|---|
| 1 | Grafana | 68,021 |
| 2 | echarts | 63,521 |
| 3 | PixiJS | 45,103 |
| 4 | Directus | 30,580 |
| 5 | fabric.js | 30,026 |
| 6 | recharts | 25,184 |
| 7 | BabylonJS | 24,112 |
| 8 | visx | 20,012 |
| 9 | bokeh | 19,852 |
| 10 | G2 | 12,304 |
| 11 | Highcharts JS | 12,249 |
| 12 | sigma.js | 11,556 |
| 13 | G6 | 11,492 |
| 14 | victory | 11,144 |
| 15 | kepler.gl | 10,763 |
| 16 | react-map-gl | 8,095 |
| 17 | metrics-graphics | 7,444 |
| 18 | react-chartjs-2 | 6,785 |
| 19 | SandDance | 6,481 |
| 20 | BizCharts | 6,184 |
| 21 | dtale | 4,910 |
| 22 | lightdash | 4,717 |
| 23 | Rath | 4,409 |
Sponsored
JavaScript Form Builder with No-Code UI & Built-In JSON Schema Editor
Add the SurveyJS white-label form builder to your JavaScript app (React/Angular/Vue3). Build complex JSON forms without coding. Fully customizable, works with any backend, perfect for data-heavy apps. Learn more.
surveyjs.io