当前位置:主页 > JavsScript库 > 图表 >

饼图和环(甜甜圈)图表JavaScript库 - Charty
栏目分类:图表   发布日期:2021-09-16   浏览次数:

Charty 是一个小型的可定制 JavaScript 库,可帮助使用纯 JavaScript 和 CSS 绘制饼图和环形图(也称为圆环图或圆形图)。不需要 SVG 和 Canvas。

使用:

1. 将 Charty 的 JavaScript 和样式表添加到页面中。

<link rel=”stylesheet” href=”./charty.css” />
<script src=”./charty.js”></script>

2. 根据您提供的数据生成环形图:

const chart = new Charty({
  title: 'Chart Title', 
  data: [
    {Stone: 24}, 
    {Wood: 7}, 
    {Steel: 29}
  ]
});

3. 根据您提供的数据生成饼图。

const another = new Charty({
  title: 'Pie Chart', 
  data: [
    {Stone: 24},
    {Wood: 7},
    {Steel: 29}
  ], 
  chartType: 'pie'
});

4.所有默认参数:

  • title:图表的标题

  • chartType:图表圆的类型|饼图

  • data:一对格式的对象数组:name/vale {name: value}

  • precision:确定图表是否具有小数精度

  • selector:图表将被插入的 html 元素,必须是一个有效的 css 选择器

new Charty({
  title = 'New Chart', 
  chartType = 'circle', 
  data = [{Test: 5}], 
  precision = false, 
  selector = 'body'
});

5. 向图表添加更多数据。

chart.addData({
  "Name", Value
});


官方网站:https://github.com/Max131/charty

相关热词: charty甜甜圈饼图图表

相关下载
声源:本站内容均来自互联网,仅供交流学习之用,请勿作商业用途,所有资源版权归原作者所有。如果有侵犯到您的权益,请联系本站删除,谢谢合作!
jQuery库 JavsScript库 Html5库 CSS3库