纯JAVASCRIPT图表动画插件Highcharts Examples


Posted in Javascript onApril 16, 2011

What is Highcharts? 下载地址 https://3water.com/jiaoben/24363.html
Highcharts is a charting library written in pure JavaScript, offering an easy way of adding interactive charts to your web site or web application. Highcharts currently supports line, spline, area, areaspline, column, bar, pie and scatter chart types.
Features
纯JAVASCRIPT图表动画插件Highcharts Examples
Compatible
It works in all modern browsers including the iPhone/iPad and Internet Explorer from version 6. Standard browsers use SVG for the graphics rendering. In Internet Explorer graphics are drawn using VML.
纯JAVASCRIPT图表动画插件Highcharts Examples
Free for Non-commercial
.
纯JAVASCRIPT图表动画插件Highcharts Examples
Pure JavaScript
Highcharts is solely based on native browser technologies and doesn't require client side plugins like Flash or Java. Furthermore you don't need to install anything on your server. No PHP or ASP.NET. Highcharts needs only two JS files to run: The highcharts.js core and either the jQuery or the MooTools framework. One of these frameworks is most likely already in use in your web page.
纯JAVASCRIPT图表动画插件Highcharts Examples
Numerous Chart Types
Highcharts supports line, spline, area, areaspline, column, bar, pie and scatter chart types. Any of these can be combined in one chart.
纯JAVASCRIPT图表动画插件Highcharts Examples
Simple Configuration Syntax
Setting the Highcharts configuration options requires no special programming skills. The options are given in a JavaScript object notation structure, which is basically a set of keys and values connected by colons, separated by commas and grouped by curly brackets.
纯JAVASCRIPT图表动画插件Highcharts Examples
Dynamic
Through a full API you can add, remove and modify series, axes or points at any time after chart creation. Numerous events supply hooks for programming agains the chart. In combination with jQuery's or MooTools' Ajax API, this opens for solutions like live charts constantly updating with values from the server, user supplied data and more.
纯JAVASCRIPT图表动画插件Highcharts Examples
Multiple Axes
Sometimes you want to compare variables that are not the same scale - for example temperature versus rainfall and air pressure. Highcharts lets you assign an y axis for each series - or an x axis if you want to compare data sets of different categories. Each axis can be placed to the right or left, top or bottom of the chart. All options can be set individually, including reversing, styling and position.
纯JAVASCRIPT图表动画插件Highcharts Examples
Tooltip Labels
On hovering the chart Highcharts can display a tooltip text with information on each point and series. The tooltip follows as the user moves the mouse over the graph, and great efforts have been taken to make it stick to the nearest point as well as making it easy to read a point that is below another point.
纯JAVASCRIPT图表动画插件Highcharts Examples
Datetime Axis
75% of all charts with an X and Y axis have a date-time X axis. Therefore Highchart is very intelligent about time values. With milliseconds axis units, Highcharts determines where to place the ticks so that they always mark the start of the month or the week, midnight and midday, the full hour etc.
纯JAVASCRIPT图表动画插件Highcharts Examples
Export and print
With the exporting module enabled, your users can export the chart to PNG, JPG, PDF or SVG format at the click of a button, or print the chart directly from the web page.
纯JAVASCRIPT图表动画插件Highcharts Examples
Zooming
By zooming in on a chart you can examine an especially interesting part of the data more closely. Zooming can be in the X or Y dimension, or both.
纯JAVASCRIPT图表动画插件Highcharts Examples
External Data Loading
Highcharts takes the data in a JavaScript array, which can be defined in the local configuration object, in a separate file or even on a different site. Furthermore, the data can be handled over to Highcharts in any form, and a callback function used to parse the data into an array.
纯JAVASCRIPT图表动画插件Highcharts Examples
Inverted Chart or Reversed Axis
Sometimes you need to flip over your chart and make the X axis appear vertical, like for example in a bar chart. Reversing the axis, with the highest values appearing closest to origo, is also supported.
纯JAVASCRIPT图表动画插件Highcharts Examples
Text Rotation for Labels

Do you want to use Highcharts for a personal website, a school site or a non-profit organisation? Then you don't need the author's permission, just go on and use Highcharts. For commercial websites and projects, see License and Pricing All text labels, including axis labels, data labels for the point and axis titles, can be rotated in any angle.

Javascript 相关文章推荐
JavaScript 学习笔记一些小技巧
Mar 28 Javascript
js写的方法实现上传图片之后查看大图
Mar 05 Javascript
javascript事件冒泡详解和捕获、阻止方法
Apr 12 Javascript
使用微信内置浏览器点击下拉框出现页面乱跳转现象(iphone),该怎么办
Jan 04 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
May 31 Javascript
jQuery+Pdo编写login登陆界面
Aug 01 Javascript
jQuery EasyUI常用数据验证汇总
Sep 18 Javascript
bootstrap滚动监控器使用方法解析
Jan 13 Javascript
ReactJs设置css样式的方法
Jun 08 Javascript
vue router仿天猫底部导航栏功能
Oct 18 Javascript
ZK中使用JS读取客户端txt文件内容问题
Nov 07 Javascript
JavaScript计算出两个数的差值
Mar 19 Javascript
分享10篇优秀的jQuery幻灯片制作教程及应用案例
Apr 16 #Javascript
javascript 弹出窗口中是否显示地址栏的实现代码
Apr 14 #Javascript
js网页侧边随页面滚动广告效果实现
Apr 14 #Javascript
jquery下jstree简单应用 - v1.0
Apr 14 #Javascript
JQuery之拖拽插件实现代码
Apr 14 #Javascript
jQuery创建插件的代码分析
Apr 14 #Javascript
Jquery公告滚动+AJAX后台得到数据
Apr 14 #Javascript
You might like
上传文件先创建目录 再上传到目录里面去
2010/12/29 PHP
PHP Undefined index报错的修复方法
2011/07/17 PHP
显示程序执行时间php函数代码
2013/08/29 PHP
ThinkPHP使用心得分享-上传类UploadFile的使用
2014/05/15 PHP
ThinkPHP表单令牌错误的相关解决方法分析
2016/05/20 PHP
PHP 访问数据库配置通用方法(json)
2018/05/20 PHP
jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
2010/04/25 Javascript
js 获取radio按钮值的实例
2013/08/17 Javascript
jQuery基于json与cookie实现购物车的方法
2016/04/15 Javascript
微信jssdk用法汇总
2016/07/16 Javascript
JavaScript“尽快失败”的原则实例详解
2016/10/08 Javascript
Javascript生成带参数的二维码示例
2016/10/10 Javascript
利用javascript实现的三种图片放大镜效果实例(附源码)
2017/01/23 Javascript
Vuejs实现带样式的单文件组件新方法
2017/05/02 Javascript
详解Angular路由 ng-route和ui-router的区别
2017/05/22 Javascript
微信小程序 页面跳转事件绑定的实例详解
2017/09/20 Javascript
echarts鼠标覆盖高亮显示节点及关系名称详解
2018/03/17 Javascript
通过一次报错详细谈谈Point事件
2018/05/17 Javascript
解决Angular4项目部署到服务器上刷新404的问题
2018/08/31 Javascript
Element UI框架中巧用树选择器的实现
2018/12/12 Javascript
Vue项目中使用WebUploader实现文件上传的方法
2019/07/21 Javascript
vue 实现cli3.0中使用proxy进行代理转发
2019/10/30 Javascript
haskell实现多线程服务器实例代码
2013/11/26 Python
Python常见读写文件操作实例总结【文本、json、csv、pdf等】
2019/04/15 Python
Python3.7 新特性之dataclass装饰器
2019/05/27 Python
python中PS 图像调整算法原理之亮度调整
2019/06/28 Python
Python any()函数的使用方法
2019/10/28 Python
Python基础之变量基本用法与进阶详解
2020/01/03 Python
Pythonic版二分查找实现过程原理解析
2020/08/11 Python
美国酒店控股公司:Choice Hotels
2018/06/15 全球购物
宣传保护环境的公益广告词
2014/03/13 职场文书
工作经验交流材料
2014/12/30 职场文书
2015年保险公司内勤工作总结
2015/05/23 职场文书
2015大学党建带团建工作总结
2015/07/23 职场文书
2016年六一文艺汇演开幕词
2016/03/04 职场文书
Vue h函数的使用详解
2022/02/18 Vue.js