F2 is a free and open-source modern charting library, released under MIT license. The aim of F2 is helping developers to create interactive visualizations for mobile devices more easier. F2 is born for mobile, developed for developers as well as designers. It is Html5 Canvas-based, and is also compatible with Node.js, Weex and React Native. Based on the grammar of graphics, F2 provides all the chart types you’ll need. Our mobile design guidelines enable better user experience in mobile visualization projects.

Features

Born for mobile

Based on the ‘accurate, effective, clear and beautiful’ visualization principles, combining with mobile device features (different devices, lacking of computing power and touch interface) and people’s habits of using mobile devices, F2 provides users with the best experience for mobile visualization from the perspective of design, performance and platform compatibility.

Design, make data more alive and chart interactions more natural. In design, the easy-to-understand, attractive expressions allowing users to get information of charts faster and more efficient during fragmented time. And about interaction, the combination of content and operation is the most in-demand during the interactive process on mobile devices, which means that the interaction behavior and its feedback is required to match the nature behavior of human. The following gifs show the interaction of single touch-drag for data exploration and multi-touch for zooming provided by F2.

From left to right: Line Chart, Stack Bar Chart and Donut Chart.

Interactions

Performance, although the hardware and computing power of mobile devices have been continuously improved, most users are not using the latest and most powerful mobile devices. As a result, F2 has always been pursuing better performance in rendering, doing a lot of optimization for mobile devices. With wide selection of chart types and still maintains a small package size(version without interaction is 44k after gzip). It also provides a modular design to support dynamic loading, you can get a even better size.

Compatibility, besides H5 env, F2 can also run in Node.js, Weex rendering and React Native, also Alipay Mini Programs and WeChat Mini Programs.

All the chart types you want

With the power of grammar of graphics, F2 supports data-driven 50+ chart types(the amount can be even more, which is depended on you) including classical charts such as line, column/bar chart, pie chart, scatter plot, gauges, etc. Additionally, F2 also provides feature-riched chart components, such as Tooltip, Legend and Guide.