Highcharts:非常漂亮的图表API
2009-12-07 11:30
by 副主编 zly06
评论(47)
有38153人浏览
收藏
JavaScript
浏览器
Java
声明:ITeye资讯文章的版权属于ITeye网站所有,严禁任何网站转载本文,否则必将追究法律责任!
<
>
猎头职位: 北京:
ITeye网站诚聘产品交互设计
Highcharts 是一个制作图表的纯Javascript类库,主要特性如下:
- 兼容性:兼容当今所有的浏览器,包括iPhone、IE和火狐等等;
- 对个人用户完全免费;
- 纯JS,无BS;
- 支持大部分的图表类型:直线图,曲线图、区域图、区域曲线图、柱状图、饼装图、散布图;
- 跨语言:不管是PHP、Asp.net还是Java都可以使用,它只需要三个文件:一个是Highcharts的核心文件highcharts.js,还有a canvas emulator for IE和Jquery类库或者MooTools类库;
- 提示功能:鼠标移动到图表的某一点上有提示信息;
- 放大功能:选中图表部分放大,近距离观察图表;
- 易用性:无需要特殊的开发技能,只需要设置一下选项就可以制作适合自己的图表;
- 时间轴:可以精确到毫秒;
- ……
代码示例:
-
var chart1 = new Highcharts.Chart ( {
-
? ? ? ? ?chart: {
-
? ? ? ? ? ? renderTo: 'chart-container-1' ,
-
? ? ? ? ? ? defaultSeriesType: 'bar'
-
? ? ? ? ?} ,
-
? ? ? ? ?title: {
-
? ? ? ? ? ? text: 'Fruit Consumption'
-
? ? ? ? ?} ,
-
? ? ? ? ?xAxis: {
-
? ? ? ? ? ? categories: [ 'Apples' , 'Bananas' , 'Oranges]
-
? ? ? ? ?},
-
? ? ? ? ?yAxis: {
-
? ? ? ? ? ? title: {
-
? ? ? ? ? ? ? ?text: ' Fruit eaten'
-
? ? ? ? ? ? }
-
? ? ? ? ?},
-
? ? ? ? ?series: [{
-
? ? ? ? ? ? name: ' Jane',
-
? ? ? ? ? ? data: [1, 0, 4]
-
? ? ? ? ?}, {
-
? ? ? ? ? ? name: ' John',
-
? ? ? ? ? ? data: [5, 7, 3]
-
? ? ? ? ?}]
-
? ? ? });
?
Highcharts主页:http://www.highcharts.com/
?
Highcharts下载:http://www.highcharts.com/downloads/zips/Highcharts.zip