Open Source TypeScript Charting Libraries

F2 is an out-of-the-box visualization engine focused on the mobile terminal, oriented to conventional statistical charts, perfectly supporting the H5 environment and compatible with multiple environments (Node, applet), complete graphics grammar theory, to meet your various visualization needs , professional mobile design guidelines to bring you the best mobile graphics experience. Best practices for moving side charts around design, performance and heterogeneous environments. Based on the grammar of graphics, Flexible construction of various charts (50+), complete components, covering various scenarios. Plugin, graphics, animation and interaction can be flexibly expanded and freely used. Covering business scenarios such as Ant membership, Alipay monthly bills, personal total assets, etc., it helps you understand your consumption data faster and better through visualization.

billboard.js is a re-usable, easy interface JavaScript chart library, based on D3.js. The name "billboard" comes from the famous "billboard chart" which everybody knows. billboard.js provides the easiest way to create a 'chart' instantly. Chart generation is super easy. With extensive options, you can create a chart instantly! Yes, billboard.js works on D3 v4+; what everybody was waiting for! All of the code was written as an ESM(ES Module) with ES6+ syntax. Combine hundreds of options to satisfy your needs. Checkout the examples to see in action! Play with the diverse options generated on the fly! If you want to use 'billboard.js' without installation, load files directly from one of the CDN providers.

visx a collection of expressive, low-level visualization primitives for React. At Airbnb, we made it a goal to unify our visualization stack across the company and in the process, we created a new project that brings together the power of D3 with the joy of React. visx is split into multiple packages. Start small and use only what you need. Bring your own state management, animation library, or CSS-in-JS solution. Odds are good your React app already has an opinion on how animation, theming, or styling is done. visx is careful not to add another one and integrates with all of them. As you start using visualization primitives, you’ll end up building your own charting library that’s optimized for your use case. You’re in control. And most importantly, it’s just React. If you know React, you can make visualizations. It’s all the same standard APIs and familiar patterns. visx should feel at home in any React codebase.

Why choose DXcharts Lite? - User-friendly interface. DXcharts Lite provides a seamless intuitive user experience with automatic scale zoom, mouse wheel zoom, and chart scrolling. - Versatile chart types. The Lite version supports eight chart types. The platform streams real-time data updates allowing users to stay on top of market movements. - Comprehensive market coverage. DXcharts Lite provides a wide-ranging selection of asset classes and extensive market coverage. This includes a variety of financial instruments such as stocks, forex, cryptocurrencies, and more. - Efficiency and speed. The platform uses HTML5 based on canvas to ensure smooth chart loading and data processing. - Snapshots. The snapshot feature is a handy tool that allows users to take and share chart snapshots anywhere. - Customisation. The platform offers users the ability to personalise their workspace allowing traders to customise their own theme or choose between the predefined dark or white ones.

BizCharts is Alibaba's general charting component library, dedicated to creating efficient, professional and convenient data visualization solutions in the middle and backend of enterprises. Based on the React charting library packaged by G2 and G2Plot, it has experienced three years of baptism in Alibaba's complex business scenarios. In terms of convenience, ease of use, and richness, it satisfies the business implementation of conventional charts and highly customized charts. After years of accumulation and continuous polishing, BizCharts 4.0 has been newly upgraded; in addition to having a flexible graphics syntax, it has added an interactive syntax and a better animation experience. At the same time, it enhances the React coding ability, and the writing is freer. The built-in encapsulation of responsive chart g2-plot works out of the box and complements the atomic capabilities of BizCharts to keep moving forward on the visual path of flexibility and ease of use.

React components for Chart.js, the most popular charting library. With v4, this library introduces a number of breaking changes. In order to improve performance, offer new features, and improve maintainability, it was necessary to break backwards compatibility, but we aimed to do so only when worth the benefit. You will find that any event which causes the chart to re-render, such as hover tooltips, etc., will cause the first dataset to be copied over to other datasets, causing your lines and bars to merge together. This is because to track changes in the dataset series, the library needs a key to be specified. If none is found, it can't tell the difference between the datasets while updating. Specify a different property to be used as a key by passing a datasetIdKey prop to your chart component.

TanStack React-Charts is a headless React library focused on composable, customizable, and performant charting components, providing flexible chart primitives without imposing styling or rendering constraints. Simple, immersive and interactive charts for React. Extensible with custom rendering layers and styles. Supports various chart types (line, bar, pie, etc.)

Reusable tested tools to build robust Angular Material & Angular applications. Vision: To build an atomic, reusable component platform for Teradata to consume, while collaborating in an open-source model. Covalent is a reusable UI platform from Teradata for building web applications with common standards and tooling. It is based on Angular and Material Design. Visualize your data easily. ECharts is an extensive "tried and true" charting library brought to Angular as Covalent Charts. td-chart-x-axis and td-chart-y-axis elements generate an axis inside a td-chart. Its the equivalent of creating a JS xAxis/yAxis object in charts. Blank main site nav component that gets hooked as a parent of all the other layouts. Layout with a custom navigation view with toolbar items and footers. Basic side sheet content.