读书人

EveryChart课程(一)-饼形图

发布时间: 2012-09-27 11:11:17 作者: rapoo

EveryChart教程(一)----饼形图

?

EveryChart是一个使用简单,功能强大的JS绘制图表工具,这里介绍如何使用

Chart是各种图表的基类,不能被实例化,图表的公共属性有:

title?标题(对象)width ?宽height?高vivid?是否动画显示showValue?是否显示值(仪表图是否显示刻度)zoom 放大的方式 通常是有follow和select两种方式zoomScale?放大倍数zoomWidth?follow放大时放大镜的宽度focusEvent?聚焦事件padding?内补丁background?背景色backgroundStop?背景色渐变的截止颜色(如果为false表示不渐变)link?是否启用链接tip?鼠标提示legend?图例item?图表的各项,因为需要比较,通常是一个数组(仪表图中设置的是一个数值),每种图item的数据结构都不同,稍后逐一介绍.PS:这个很重要

?

?

var pie = new Chart.Pie({ 'item' : [ {'text':'IE', 'value' : '53.68%'}, {'text':'Firefox', 'value' : '21.67%'}, {'text':'Chrome', 'value' : '13.11%'}, {'text':'Opera', 'value' : '1.73%'}, {'text':'Safari', 'value' : '7.48%'}, {'text':'Other', 'value' : '1.73%'} ], 'padding' : 55, 'showValue' : true }).render('canvas-wrapper');??

饼型图item的数据结构是

[{'text':text,'value':value,'color':color}]

?

text ?比较项的名称value ?比较项的只,可以是Number或百分比型的color? ?比较项的颜色(如果不特殊设定,使用默认颜色)

?

一个饼型图就这样生成了,简单不?


EveryChart课程(一)-饼形图

如果想要鼠标滑动凸出扇形,将focusEvent设置为mousemove即可

具体例子可以参见?http://everyjs.co.cc/demo.html#pie1

1 楼 沐雪若非 2011-11-22 错误: 无法获取属性“offsetWidth”的值: 对象为 null 或未定义
楼主帮我看下这是什么错误啊 2 楼 yg 2011-11-22 是在使用时出的错还是在浏览demo时出的错
能把具体的代码贴上来么?
3 楼 madongzhi 2012-04-24 js我是完全复制过去的,在vs2008上提示“Microsoft JScript 运行时错误: 'c.css(...)' 为空或不是对象”,这是什么原因啊,能发个完整的例子吗,1181291387@qq。com

读书人网 >Web前端

热点推荐