datavjs Version: 0.1.1 By @DataV

DataV.js is a JavaScript library for data visualization

饼图(Pie)简介

饼图通常用来表示多个元素的占比。饼图的优点是很容易很直观的看出各个元素的占比,缺点则在于饼图无法表现太多的元素。

绘制饼图

绘制饼图的代码如下:

//创建Pie对象,包含于id为"chart"的dom结点,宽、高分别为700px、500px。
var pie = new Pie("chart", {"width": 700, "height": 500});        
//设置数据,输入的数据为一个二维数组。
pie.setSource(source); //source is a 2-d array
//绘制
pie.render();

属性配置

设置Pie选项时,可以设置如下属性:

  • width:画布宽度,默认500px
  • height:画布高度,默认500px
  • legend: 是否有图例。默认true。

数据说明

var source = [
  '北京', 50265
  '上海', 60555
  '广州', 38544
  '深圳', 27276
  '西安', 20506
  '昆明', 26916
  '武汉', 17636
  '拉萨', 977
  '哈尔滨', 10406
  '乌鲁木齐', 6695
];