首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

Highcharts纯Javascript图表施用讲解(附Demo全源码案例)

2012-11-07 
Highcharts纯Javascript图表使用讲解(附Demo全源码案例)Highcharts是一个制作图表的纯Javascript类库,主要

Highcharts纯Javascript图表使用讲解(附Demo全源码案例)

Highcharts是一个制作图表的纯Javascript类库,主要特性如下:

  • 兼容性:兼容当今所有的浏览器,包括iPhone、IE和火狐等等;
  • 对个人用户完全免费;
  • 纯JS,无BS;
  • 支持大部分的图表类型:直线图,曲线图、区域图、区域曲线图、柱状图、饼装图、散布图;
  • 跨语言:不管是PHP、Asp.net还是Java都可以使用,它只需要三个文件:一个是Highcharts的核心文件highcharts.js,还有a canvas emulator for IE和Jquery类库或者MooTools类库;
  • 提示功能:鼠标移动到图表的某一点上有提示信息;
  • 放大功能:选中图表部分放大,近距离观察图表;
  • 易用性:无需要特殊的开发技能,只需要设置一下选项就可以制作适合自己的图表;
  • 时间轴:可以精确到毫秒;

     

    Highcharts 官网:http://www.highcharts.com

    Highcharts 官网示例:http://www.highcharts.com/demo/

    Highcharts 官网文档:http://www.highcharts.com/documentation/how-to-use

     

    参数描述默认值layout显示形式,支持水平horizontal和垂直verticalhorizontalalign对齐方式。centerbackgroundColor图例背景色。nullborderColor图例边框颜色。#909090borderRadius图例边框角度5enabled是否显示图例truefloating是否可以浮动,配合x,y属性。falseshadow是否显示阴影falsestyle设置图例内容样式''

    本文未列出来的选项设置请参照highcharts官网英文文档:http://www.highcharts.com/ref/ 

     

    源码Demo全案例(含导出)下载地址

     

     

  • 热点排行
    Bad Request.