饼布局

优质
小牛编辑
134浏览
2023-12-01

饼布局方便与计算组成饼图或圈图的弧的开始和结束的角度:

饼布局并不是只能绘制饼状图,如果你喜欢,你还可以直接用她来绘制弧形状。饼布局会简单的将一个数据数组(如字符串数据)转换成一个对象数据,这个对象数组中会包含开始角度和结束角度,这些角度的范围为0到2π,然后传给弧形生成器。

d3.layout.pie()

构造一个新的饼图函数,使用默认的值访问器(数值)、进行比较排序(降序)、开始角度(0)、结束角度(2π);返回的布局对象即是对象也是一个函数,这就意味着:你可以想调用方法一样调用该布局对象,布局还具有改变其行为的其他方法;就像D3的其他类型方法一样,饼布局也支持方法链模式,setter方法返回布局自身,允许在一个简单的申明中调用多个setter方法。

pie(values[, index])

用指定的values数组计算饼函数。一个可选的index 参数会被传递给开始和结束的函数;返回值是一个数组,数组元素包含以下属性: • value - 数据值,计算来自于value 生成器; • startAngle - 弧的开始弧度,非角度; • endAngle - 弧的结束弧度,非角度; • data - 数据原生的值; 按照原生的排序返回元素,匹配values参数,即使排序顺序已经应用了;这保证了数组中每个元素原生的索引,这是非常好的,当你使用原生的值数组来匹配颜色分类时。

pie.value([accessor])

指定如何从关联的数据提取值(如:给饼图绑定一个访问器函数);accessor 是一个函数,会在每个输入值传给pie时调用,原理相当于在计算饼布局前,先调用了values.map(accessor);该函数可以传两个参数:当前的数据d和所在索引i;默认的值函数是内置的Number,类似于特征函数;如果未指定accessor ,则返回当前的访问器 。

pie.sort([comparator])

如果指定comparator ,则设置数据的排序方法为指定的;传入null来禁止排序;如果未指定comparator ,则返回当前的comparator ;默认的排序方法是降序;排序会保留原生数据的索引,只会影响到角度;排序函数会在每对传给 pie的数据上调用;当然,该排序函数你可以使用 d3.ascending 或 d3.descending代替。

pie.startAngle([angle])

如果指定angle ,则设置饼布局所有的起始弧度为指定值:如果未指定angle ,返回当前的值,默认为0;起始弧度可以被指定为常数或一个函数,如果是函数,当 pie被调用时,会进行一次起始弧度的计算,被传递的参数有:当前数据d和索引i。

pie.endAngle([angle])

如果指定angle ,则设置饼布局所有的起始弧度为指定值:如果未指定angle ,返回当前的值,默认为2π;起始弧度可以被指定为常数或一个函数,如果是函数,当 pie被调用时,会进行一次起始弧度的计算,被传递的参数有:当前数据d和索引i。

  • 魏飞译 2014-07-16-19-25
  • 咕噜校对 2014-11-30 21:19:34