UIPieChart

reloadData close show

论坛示例

为帮助用户更好更快的使用模块,论坛维护了一个,示例中包含示例代码、知识点讲解、注意事项等,供您参考。

概述

UIPieChart是一个饼图数据展示控件,支持开发者自定义数据块样式,支持图标展示,点击可返回当前点击区域数据,支持圆形和环形两种形状饼图展示。

open

注意:请保证 所有数值加起来不为0 否则无实际意义

打开饼图视图

open({params}, callback(ret, err))

x:

  • 类型:数字
  • 描述:(可选项)圆心坐标
  • 默认值:0

y:

  • 类型:数字
  • 描述:(可选项)圆心坐标
  • 默认值:100

radius:

  • 类型:数字
  • 描述:(可选项)圆半径
  • 默认值:当前屏幕宽的1/4

type:

  • 类型:字符串类型
  • 描述:(可选项)饼图样式
  • 默认值:’typeCircle’

isAnimated:

  • 类型:布尔类型
  • 描述:(可选项)是否带动画
  • 默认值:true

center:

  • 类型:JSON 对象
  • 描述:(可选项)饼形图中间标题样式设置(仅圆环样式下有效)
  • 默认值:见内部字段
  • 内部字段:

elements:

  • 类型:数组
  • 描述:模块字典对象组成的数组
  • 内部字段:
  1. value: //数字类型;本部分的数值大小
  2. color: //字符串类型;本部分颜色,支持 rgb、rgba、#;默认:#000000
  3. title: //(可选项)字符串类型;单元格显示的标题,若不传则显示百分比,若传空字符串则显示空字符串
  4. titleColor//(可选项)字符串类型;标题的颜色,支持 rgb、rgba、#;默认:#ffffff
  5. titleSize //(可选项)数字类型;标题的字体大小;默认:12
  6. image: //单元格显示的图标,若不传则不显示,百分比过小图片不显示
  7. }]

fixedOn:

  • 类型:字符串
  • 描述:(可选项)添加到哪个frame,与fixed一起使用

fixed:

  • 类型:布尔
  • 描述:(可选项)模块是否随所属 window 或 frame 滚动
  • 默认值:true(不随之滚动)

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. index: //数字类型;返回饼图0度(圆形最下端)位置的模块的索引值
  3. value: //数字类型;返回饼图0度(圆形最下端)位置的模块的值
  4. percent: //数字类型;返回饼图0度(圆形最下端)位置的模块的百分比值
  5. }

示例代码

可用性

可提供的1.0.0及更高版本

reloadData

刷新展示数据

注意:请保证 所有数值加起来不为0 否则无实际意义

reloadData({params}, callback(ret, err))

params

id:

  • 类型:数字
  • 描述:操作的视图的id

elements:

  • 类型:数组
  • 描述:模块字典对象组成的数组
  • 内部字段:
  1. [{
  2. value: //数字类型;本部分的数值大小
  3. color: //字符串类型;本部分颜色,支持 rgb、rgba、#;默认:#000000
  4. titleColor//(可选项)字符串类型;标题的颜色,支持 rgb、rgba、#;默认:#ffffff
  5. titleSize //(可选项)数字类型;标题的字体大小;默认:12
  6. }]

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:

    1. {
    2. status: true, //布尔类型;数据源是否刷新成功, true|false
    3. count: 20 //数字类型;刷新数据后总数据量数
    4. }

示例代码

iOS系统,Android系统

可提供的1.0.0及更高版本

setFrame

重设模块视图的位置大小

serFrame({params})

params

id:

  • 类型:数字
  • 描述:操作的视图的id

x:

  • 类型:数字
  • 描述:(可选项)圆心坐标
  • 默认值:原值

y:

  • 类型:数字
  • 描述:(可选项)圆心坐标
  • 默认值:原值

radius:

  • 类型:数字
  • 描述:(可选项)圆半径
  • 默认值:原值

anim:

  • 类型:布尔
  • 默认值:false
  • 描述:(可选项)改变模块视图大小时是否添加变化过程的动画

示例代码

  1. UIPieChart.setFrame({
  2. id: 1,
  3. x: 10,
  4. y: 300,
  5. anim: true
  6. });

可用性

可提供的1.0.1及更高版本

close

关闭饼图

close({params})

params

id:

  • 类型:数字
  • 描述:要关闭的饼图的id

示例代码

  1. var UIPieChart = api.require('UIPieChart');
  2. UIPieChart.close({
  3. id: 1
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

hide

隐藏饼图

hide({params})

id:

  • 类型:数字
  • 描述:要隐藏的饼图的id

示例代码

补充说明

隐藏饼形图,并没有从内存里清除

可用性

iOS系统,Android系统

可提供的1.0.1及更高版本

show

显示已隐藏的饼形图

show({params})

params

id:

  • 类型:数字
  • 描述:要显示的饼图的id

示例代码

  1. var UIPieChart = api.require('UIPieChart');
  2. UIPieChart.show({
  3. });

可用性

iOS系统,Android系统

可提供的1.0.1及更高版本