highcharts 基本使用手册 中文API
需积分: 2 171 浏览量
2014-09-25
17:16:08
上传
评论
收藏 1.1MB DOC 举报
Highcharts 是一个使用 javascript 脚本来生成图表的工具，和 jfreechart 作用类似，都用来生成各种图
表，并支持图片的导出和打印。
从官网 www.highcharts.com 上下载的压缩表中的 example 中有各种图表的例子。
要编写生成图表的例子建议从 文件名后带 basic 的文件看起，看到例子后你会发现，highcharts 使用起
来 时 非 常简单的 ， 我 们 要 做 的 仅 仅 是 把 数 据 组 织 好 ， 让 在 页 面 onload 时 把 数 据 设 置 到 组 件
（Highcharts.Chart）中即可。
一、 改改自带的例子 http://export.highcharts.com/
先来个例子：
第一步： 下载 Highcharts-2.1.3.zip 包 和 jquery-min-1.4.2.js
以下两个文件的下载地址：
http://www.highcharts.com/download
http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js
第二步： 创建一个 html 文件在文件的 head 标签部分，加入对相关 js 文件的引入：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
Highcharts 的核心文件
<script type="text/javascript" src="../js/highcharts.js"></script>
处理导出图片功能的 js 文件
<script type="text/javascript" src="../js/modules/exporting.js"></script>
第三步：编写相关 js 代码
在上面的导入 js 文件代码后继续加入以下代码：
<!-- 2. Add the JavaScript to initialize the chart on document ready -->
<script type="text/javascript">
var chart;
$(document).ready(function() {
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
defaultSeriesType: 'line',
marginRight: 130,
marginBottom: 25
},
title: {
text: 'Monthly Average Temperature',
x: -20 //center
},
subtitle: {
text: 'Source: WorldClimate.com',
x: -20
剩余11页未读，继续阅读
资源评论
