帮酷LOGO
0 0 评论
  • 显示原文与译文双语对照的内容
文章标签:bea  angular  chart  CHAR  BASE  
Beautiful charts for Angular2 based on Chart.js

  • 源代码名称:ng2-charts
  • 源代码网址:http://www.github.com/valor-software/ng2-charts
  • ng2-charts源代码文档
  • ng2-charts源代码下载
  • Git URL:
    git://www.github.com/valor-software/ng2-charts.git
  • Git Clone代码到本地:
    git clone http://www.github.com/valor-software/ng2-charts
  • Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/valor-software/ng2-charts
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
  • ng2-charts npm versionnpm downloadsslack

    基于 Chart.js的Angular2漂亮图表

    NPMNPM

    使用&演示

    以下网站的示例使用 ng2-charts@1.1.0

    http://valor-software.github.io/ng2-charts/http://plnkr.co/edit/7fGsiuRjcF0M0Ffeoml2?p=preview

    安装

    • 你可以使用npm安装英镑的
    npm install ng2-charts --save
    npm install chart.js --save

    重要的: 在应用程序中嵌入 Chart.js 是必需的 !

    <scriptsrc="node_modules/chart.js/src/chart.js"></script>

    使用&演示

    可以在这里找到 ng2-charts的演示和API详细信息: 演示源代码。

    System.js

    可以在 bundles 包的目录或者 npm 中找到 System.js 包。

    API

    导入

    import { ChartsModule } from'ng2-charts/ng2-charts';// In your App's module:imports: [
     ChartsModule]

    图表类型

    所有图表类型都有一个指令: base-chart,并且有 6种类型的图表: ,linebarradarpiepolarAreadoughnut

    属性

    注意 : 有关可能的选项的更多信息,请参阅原始的 chart.js 文档文档

    • ( data ( Array<number[]> | number[] ) - 图表的点集,它应该是 linebarradarArray<number[]>,否则是 number[]
    • datasets ( Array<{data: Array<number[]> | number[], label: string}> ) - data 有关数据集的label,该数据集显示在图例和工具提示中
    • labels ( ?Array<any> ) - x 轴标签。 图表有必要:linebarradar。 为图表添加标签( 悬停时): polarAreapiedoughnut
    • chartType ( ?string ) - 指示图表的类型,它可以是: linebarradarpiepolarAreadoughnut
    • options ( ?any ) - 图表选项( 来自 chart.js 文档 )
    • 如果没有指定( 见下面),colors ( ?Array<any> ) 将使用默认的and|or随机颜色。
    • legend: ( ?boolean=false ) - 如果 true 在图表下面显示图例,则不显示

    事件

    • chartClick: 当点击图表时激发,返回有关活动点和标签的信息
    • chartHover: 在图表上发生发生点击( 悬停) 时激发,返回有关活动点和标签的信息

    颜色

    有几种默认颜色。 可以使用 colors 属性替换颜色。 如果有比颜色更多的数据,则随机生成颜色。

    故障排除

    在报告 Bug 和功能请求时,请遵循以下准则:

    • 使用 GitHub发布报告 Bug 和功能请求( 而不是我们的电子邮件地址)
    • 请始终按写步骤来重现错误。 这样我们可以重点在修复 Bug,而不是重复我们的头脑尝试复制它。

    感谢你的理解 !

    许可证

    MIT许可证( 请参阅许可文件以获得全文)



    文章标签:BASE  angular  CHAR  bea  chart  

    Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语