极客小秘籍 —— Chart.js



  • 0_1469509775891_GitHubGroupLogo_bw.png

    HTML5图表库 Chart.js

    Chart.js 是一个基于HTML5 canvas技术的响应式、开源(MIT)、轻量级的图表库。它目前提供了8种图表的样式(Line、Bar & Horizontal Bar、Radar、Polar Area、Pie & Doughnut 以及 Bubble),每种样式都有丰富的自定义选项和棒棒的动画效果哦~

    0_1469509755156_Picture7.png

    安装

    通过 npm 进行安装。

    npm install chart.js --save
    

    举个小栗子 🌰

    让我们来用Chart.js做一个简单的Bar chart吧^^

    0_1469508432395_Screen Shot 2016-07-22 at 4.03.05 PM.png
    结果华丽华丽的~

    0_1469508457479_Screen Shot 2016-07-22 at 4.03.45 PM.png

    复杂一点的栗子 🌰🌰

    咱们 太阁唧哈(GitHub)小组 出品的 太阁极客榜 又出来刷屏啦~ 下图中的 line chart 和 Doughnut chart 就是通过 angular-chart.js 引用 Chart.js 制作的!

    https://github.com/hackjustu/Github-Ranking-FrontEnd

    0_1469508475819_Screen Shot 2016-07-22 at 5.12.13 PM.png

    学习资源

    中文教程:www.bootcss.com/p/chart.js
    英文官网:www.chartjs.org

    前往Chart.js官网~

    0_1469509039136_太阁GitHub小组_ChartJS.jpg

    极客小秘籍 是 太阁唧哈(GitHub)小组 出版的专注于推广GitHub开源项目的系列短文。如果对我们感兴趣,请微信联系cosmo89929 ~


登录后回复
 

与 BitTiger Community 的连接断开,我们正在尝试重连,请耐心等待