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

highcharts打造强大的页面图表

2012-11-07 
highcharts制作强大的页面图表官方网址:http://www.highcharts.com/ 1、什么是HighCharts?? Highcharts 是

highcharts制作强大的页面图表
官方网址:http://www.highcharts.com/




1、什么是HighCharts?

     ? Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在您的web网站或是web应用程序添加有交互性的图表。

     ? 目前HighCharts支持的图表类型有 直线图、曲线图、区域图、区域曲线图、柱状图、饼状图和散状点图。







2、HighCharts的主要特点?



     ?速度快,看起来很雅致,界面漂亮。


    ?不像Flash或Java需要插件才可使用。


    ?弹出窗口是沒有问题的。可以在当前的浏览器窗口中打开內容。


    ?单点击。弹出的內容在当前浏览器窗口中,用户还可以在保留当前弹出內容的情況下继续滚动网页而不需要关闭它。


    ?大量的配置选项和可扩展性。一个组件系統可让您未使用的功能压缩到一个10kB的文件大小。


    ?出色的,无条件的和不限用户身分,包含支持商业和非商业用户。


    ?具有良好的兼容性和可访问性,当用户在Javascrip 失效的情況下,或是使用早期版本的浏览器,浏览器仍然会重定向到图片本身或事先指定的HTML页。


    ?包含js源码,有余力的同志可以研究下源码。



这里简单的东拼西凑的简单介绍,不是重点,简单看下,就过去,接下来第二篇将介绍HighCharts的构成。





使用过程如下:

   1.导入highcharts相关的js。

   2.编写相关的highcharts的数据脚本,可以到highcharts官方网站,选择适合自己项目需求的。

   3.在页面设置相关的highcharts的div容器。绑定相关的图表。










相关的highcharts 需要的js和样式。
highcharts的几个问题:
1.在右边下方有一个网络连接。
   在highcharts.js或者highcharts.src.js中使用替换将www.highcharts.com替换为#
2.在生成的图表中的打印按钮和导出按钮的屏蔽。
   在页面不要导入exporting.src.js或者exporting.js的js即可。
概述exporting.js文件
里的exporting.js文件在项目中起 打印 图表转图片文件的作用
   但由于部分功能链接官网去调用方法,所以在非联机的情况,且对图表没有打印功能要求,可以将其屏蔽

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

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

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

热点排行