hero

FundCharts

轻量级canvas数据可视化组件库

快速上手 →

重图形

只注重图形的可视化实现,画布以及换算提供全面接口供二次绘制。

轻量级

体积小无依赖,全量直接引用仅28k,开启gzip仅9.7k;按需引用打包更小。

兼容好

小程序端;web Android4及以上,ios8及以上;nodejs8.0及以上。

介绍

npm package

FundChartsJS是轻量级的canvas数据可视化组件库,可在web移动端、小程序端、服务端nodejs直接使用,无三方依赖。核心原则:轻量,只注重图形。包含折线图、面积图、饼图、环形图、柱状图、雷达图(蜘蛛图),散点图,K线图,持续更新及维护。

注:对于有一定canvas开发经验的人员来说,通过实例的再次绘制可以完全实现特殊的可视化定制化效果。

兼容:

browser

  • ios8及以上
  • android 4及以上
  • PC IE9+/Firefox/Opera/Chrome/Safari12+

注:与Vue、React、Angular等框架库均无冲突。

weapp

  • 兼容

server

  • nodejs v8.0+

最新版本

使用

browser(FundCharts.min.js)

<script src="./FundCharts.min.js"></script>
var LineChart = FundCharts.line;

weapp

const FundCharts = require('./FundCharts.min.js');

const LineChart = FundCharts.line;

nodejs(FundCharts-node.js)

nodejs服务端需安装node-canvas及其图形环境。

const Canvas = require('Canvas');
const { FundCharts } = require('./FundCharts-node');
    
let LineChart = FundCharts.line;