jQuery Chart图表制作组件Highcharts用法详解
发布于 2016-10-20 13:26:52 | 85 次阅读 | 评论: 0 | 来源: 网友投递
Highcharts 纯Javascript图表
Highcharts是一个制作图表的纯Javascript类库
这篇文章主要介绍了jQuery Chart图表制作组件Highcharts用法,详细分析了Highcharts插件的功能与具体使用技巧及相关注意事项,需要的朋友可以参考下
本文实例讲述了jQuery Chart图表制作组件Highcharts用法。分享给大家供大家参考，具体如下：
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/download
jquery下载地址
本次介绍是把highcharts中的第一个文件拷贝过来，然后把其他的功能加在了这个文件中，然后查询相关资料，导出图片格式不需要连到官方服务器了，只需要在本地就可以。
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="highchart_export_module_asp_net._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Highchart js export module sample</title>
<!-- 1.引入jquery库 -->
<script src="Javascript/jquery-1.5.1.js" type="text/javascript"></script>
<!-- 2.引入highcharts的核心文件 -->
<script src="http://img.phperz.com/data/img/20161019/1476859741_6761.png?201651121633" />
导出的图片格式
可以做到页面展示和导出的图片一致了。