HighCharts 特性;Highcharts 环境配置
Highcharts
Highcharts 是一个用纯JavaScript编写的一个图表库。
Highcharts 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表
Highcharts 免费提供给个人学习、个人网站和非商业用途使用。
HighCharts 特性
- 兼容性 - 支持所有主流浏览器和移动平台(android、iOS等)。
- 多设备 - 支持多种设备,如手持设备 iPhone/iPad、平板等。
- 免费使用 - 开源免费。
- 轻量 - highcharts.js 内核库大小只有 35KB 左右。
- 配置简单 - 使用 json 格式配置
- 动态 - 可以在图表生成后修改。
- 多维 - 支持多维图表
- 配置提示工具 - 鼠标移动到图表的某一点上有提示信息。
- 时间轴 - 可以精确到毫秒。
- 导出 - 表格可导出为 PDF/ PNG/ JPG / SVG 格式
- 输出 - 网页输出图表。
- 可变焦 - 选中图表部分放大,近距离观察图表;
- 外部数据 - 从服务器载入动态数据。
- 文字旋转 - 支持在任意方向的标签旋转。
支持的图表类型
HighCharts支持的图表类型:
| 序号 | 图表类型 |
|---|---|
| 1 | 曲线图 |
| 2 | 区域图 |
| 3 | 饼图 |
| 4 | 散点图 |
| 5 | 气泡图 |
| 6 | 动态图表 |
| 7 | 组合图表 |
| 8 | 3D 图 |
| 9 | 测量图 |
| 10 | 热点图 |
| 11 | 树状图(Treemap) |
Highcharts 环境配置
本章节我们将为大家介绍如何在网页中使用 Highcharts。
本教程将 Highcharts 与 jQuery 结合使用,所以在加载 Highcharts 前必须先加载 jQuery 库。
如果你对 jQuery 不熟悉,可以参阅本站的jQuery 教程。
安装 jQuery
jQuery 安装可以使用以下两种方式:
- 1、访问 jquery.com 下载jQuery包。
2、使用 BootCDN 静态资源库的jQuery资源:
http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js
3、使用百度静态资源库的jQuery资源:
http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js
使用下载的方式
使用下载的方式,在 HTML 页面引入 jQuery 代码:
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
使用 CDN(推荐)
使用 BootCDN 静态资源库来加载jQuery库:
<head>
<script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
</head>
安装 Highcharts
Highcharts 安装可以使用以下两种方式:
- 1、访问 highcharts.com 下载 Highcharts 包。
- 2、使用官方提供的 CDN 地址:http://code.highcharts.com/highcharts.js
使用下载的方式(推荐)
使用下载的方式,在 HTML 页面引入 Highcharts 代码:
<head>
<script src="/highcharts/highcharts.js"></script>
</head>
使用 CDN
使用官方提供的 CDN 地址:
<head>
<script src="http://code.highcharts.com/highcharts.js"></script>
</head>
HighCharts 特性;Highcharts 环境配置的更多相关文章
- Spring环境配置
研究spring3的时候发现一个非常好用的特性:环境配置(spring2是否有此特性未知) 官方演示样例代码例如以下: <!-- app-config.xml --> <beans ...
- Highcharts 环境配置
Highcharts 环境配置 本章节我们将为大家介绍如何在网页中使用 Highcharts. Highcharts 依赖于 jQuery,所以在加载 Highcharts 前必须先加载 jQuery ...
- HighCharts学习笔记(二)HighCharts结构及详细配置
HighCharts结构及详细配置: 一.HighCharts整体结构: 通过查看API文档我们知道HighCharts结构如下:(API文档在文章后面提供下载) var chart = new Hi ...
- XMPP开发环境配置
首先配置XMPP开发环境配置需要的软件 先安装xampp-osx-1.8.3-5-installer.dmg 安装成功后launchpad里会多出一个XAMPP(其他),点开里面的manager-os ...
- Android 开发基础及环境配置
2011年买了第一部安卓操作系统的手机,当时势头正盛的HTC不可思议(incredible),当时的想法就是想学习下智能手机开发,但是由于各种原因,客观上是公司的项目太忙了,忙于项目管理.团队建设.客 ...
- (转) 一步一步学习ASP.NET 5 (一)- 基本概念和环境配置
转发:微软MVP 卢建晖 的文章,希望对大家有帮助. 编者语:时代在变,在csdn开博一年就发了那么的两篇文章,无论是什么原因都觉得有愧了.但是今年重心都会在这里发表一些文章,和大家谈谈.NET, 移 ...
- Windows7+VS2012下OpenGL 4的环境配置
系统环境 Windows 7 Ultimate x64,Visual Studio Ultimate 2012 Update 4,和一块支持OpenGL 4.x的显卡. 准备工作 首先用GPU Cap ...
- Laravel教程 一:安装及环境配置
Laravel教程 一:安装及环境配置 此文章为原创文章,未经同意,禁止转载. Homestead 最近在SF上面看到越来越多的Laravel相关的问题,而作为一个Laravel的脑残粉,本来打算有机 ...
- PySe-001-基础环境配置(MacOX)
Python 是一种面向对象.解释型计算机程序设计语言,其源代码同样遵循 GPL(GNU General Public License)协议.Python语法简洁而清晰,具有丰富和强大的类库.由于Py ...
随机推荐
- 设置eclipse启动时所需要的jdk
eclipse启动时默认的时环境变量中的JDK,但如果环境变量中的jdk版本比较低,那么eclipse是启动不了的, 比如系统中运行的程序中使用的是jdk1.7,但eclipse版本2018需要jdk ...
- PKU 2155 Matrix(裸二维树状数组)
题目大意:原题链接 题意很简单,就不赘诉了. 解题思路: 使用二维树状数组,很裸的题. 二维的写起来也很方便,两重循环. Add(int x,int y,int val)表示(x,y)-(n,n)矩形 ...
- link cut tree模板(LCT模板)
update:2017.09.26 #include <bits/stdc++.h> using namespace std; struct Link_Cut_Tree { + ; ], ...
- 新linux系统上rz 与sz命令不可用
使用命令进行安装:yum install lrzsz 即可使用
- java单例模式之懒汉式分析
转自:http://blog.csdn.net/withiter/article/details/8140338 今天中午闲着没事,就随便写点关于Java单例模式的.其实单例模式实现有很多方法,这里我 ...
- WCF基本知识
1.开通WCF调试服务: 须在服务端的行为中作如下配置:includeExceptionDetailInFaults="true" 代码如下: <behaviors> ...
- FactoryBean
总结自:https://www.cnblogs.com/davidwang456/p/3688250.html Spring中有两种类型的Bean,一种是普通Bean,另一种是工厂Bean,即xxxF ...
- 转载:vsftp中的local_umask和anon_umask
转载出处:http://blog.sina.com.cn/s/blog_67c5699001010e3e.html umask是unix操作系统的概念,umask决定目录和文件被创建时得到的初始权限u ...
- 20145321 《Java程序设计》第2周学习总结
20145321 <Java程序设计>第2周学习总结 教材学习内容总结 一.类型.变量.运算符 1.类型(基本类型) (1)整数:short(占2字节),int(占4字节),long(占8 ...
- 快用Visual Studio(四)- 主题 偏好与快捷键
使用$ CMD + ,打开快捷键设置窗口 使用$ CMD + SHIFT + ,切换默认配置 使用$ CMD + SHIFT + O打开搜索框搜索已配置选项 关于代码偏好设置有三种模式: 默认模式:C ...