takeaway
F2, visual graphics engine for mobile. Since the release of 3.1, we have been striving to provide high performance, high scale, out of the box vivid charts, and multi-terminal adaptation has been our goal in the face of diverse mobile environments. With the 3.6 update, we have not only achieved a breakthrough in performance, but also achieved a true sense of multi-terminal running of one piece of code in terms of multi-terminal adaptation.
Preview feature
💪 stronger
Gesture interaction
In F2 3.6, we reworked the whole thing with zooming and panning, removing hammerJS’s dependence on browser features and implementing internal gestures such as zooming and panning. ✨ took gestures beyond the limits of the end and made them fully available! ✨.
Gesture interaction on H5
| The line chart | A histogram |
|---|---|
 |
 |
Gesture interaction on applets
| The line chart | A histogram |
|---|---|
 |
 |
See F2-WX-Demo for an example.
React Native diagrams and gestures
| The line chart | A histogram |
|---|---|
 |
 |
Example: f2-Rn-gcanvas -demo.
F2 in other environments
Our goal is the full end, we will provide a whole set of chart solutions under Native, so that you can easily use F2 to achieve visual charts in Native, so that you can achieve a full run of code! If you want to draw on the Nodejs side, f2-node-demo will do the trick.
🚀 faster
On the basis of complex gestures, we specifically optimized the performance of F2, and implemented more fine-grained control over the life cycle of internal instances, which greatly improved the performance of secondary rendering of charts, especially the experience of chart gesture interaction.
Performance of each model
Here is a comparison of 2200 data points rendered by each model:
Performance on the iPhone 7P
| Version 3.5 | Version 3.6 |
|---|---|
 |
 |
👍 iPhone 7p fluency is significantly improved, the overall drawing time is reduced by 40%, full frame run without pressure!
Performance on the HTC M8st
| Version 3.5 | Version 3.6 |
|---|---|
 |
 |
**👍** 3.5 is almost unavailable on low-end models, while version 3.6 is basically fine!
Code demo
| Version 3.5 | Version 3.6 |
|---|---|
| Code examples:Codesandbox. IO/s / 35 – pinch -… | Code examples:Codesandbox. IO/s / 36 – pinch -… |
Qr code Preview |
Qr code Preview |
About the future
As mentioned in THE previous AntV architecture evolution -F2, F2 will also enter the 4.0 era and there will be more interoperability between F2 and G2, but our goal remains the same: to bring high-performance, scalable, and out-of-the-box visual graphics solutions to mobile devices
How to upgrade
The main function of version 3.6 this time is fully compatible upgrade, which can be used safely. Zooming and dragging are new implementation and built-in by default, so you can experience it by removing the previous on-demand reference mode. Of course, if you have any questions, please contact us through any of the following channels or directly give us PR.
The last
Thank you so much for reading, and if you’re interested in F2, don’t forget to check out watch, Star and Fork on GitHub!
- Liverpoolfc.tv: f2. Antv. Vision/useful
- Making: github.com/antvis/F2
- Alipay small program version: github.com/antvis/my-f…
- Wechat small program version: github.com/antvis/wx-f…
- Nailing group:
