纯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 相关文章推荐
js的闭包的一个示例说明
Nov 18 Javascript
基于jquery自己写tab滑动门(通用版)
Oct 30 Javascript
DOM基础教程之模型中的模型节点
Jan 19 Javascript
JavaScript实现文字跟随鼠标特效
Aug 06 Javascript
angularjs表格ng-table使用备忘录
Mar 09 Javascript
JQuery 封装 Ajax 常用方法(推荐)
May 21 jQuery
微信小程序“摇一摇”的实例代码
Jul 20 Javascript
angular+ionic返回上一页并刷新页面
Aug 08 Javascript
Angular项目从新建、打包到nginx部署全过程记录
Dec 09 Javascript
JS重学系列之聊聊new操作符
Mar 04 Javascript
微信小程序实现搜索指定景点周边美食、酒店
May 18 Javascript
vue.js购物车添加商品组件的方法
Sep 17 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
PHP setcookie() cannot modify header information 的解决方法
2009/01/09 PHP
php中time()和mktime()方法的区别
2013/09/28 PHP
PHP的error_reporting错误级别变量对照表
2014/07/08 PHP
php获取CSS文件中图片地址并下载到本地的方法
2014/12/02 PHP
Javascript var变量隐式声明方法
2009/10/19 Javascript
jQuery源码分析-05异步队列 Deferred 使用介绍
2011/11/14 Javascript
详解JavaScript函数对象
2015/11/15 Javascript
Vue中的验证登录状态的实现方法
2019/03/09 Javascript
jQuery创建折叠式菜单
2019/06/15 jQuery
VUE+node(express)实现前后端分离
2019/10/13 Javascript
vue之debounce属性被移除及处理详解
2019/11/13 Javascript
javascript实现获取中文汉字拼音首字母
2020/05/19 Javascript
vant picker+popup 自定义三级联动案例
2020/11/04 Javascript
如何在 Vue 中使用 JSX
2021/02/14 Vue.js
[30:00]完美世界DOTA2联赛PWL S2 Rebirth vs LBZS 第二场 11.28
2020/12/01 DOTA
Python多重继承的方法解析执行顺序实例分析
2018/05/26 Python
Python打包方法Pyinstaller的使用
2018/10/09 Python
Python判断对象是否相等及eq函数的讲解
2019/02/25 Python
Python3 venv搭建轻量级虚拟环境的步骤(图文)
2019/08/09 Python
python 进程间数据共享multiProcess.Manger实现解析
2019/09/23 Python
Tensorflow的常用矩阵生成方式
2020/01/04 Python
python+adb+monkey实现Rom稳定性测试详解
2020/04/23 Python
简单了解Django项目应用创建过程
2020/07/06 Python
Pycharm配置lua编译环境过程图解
2020/11/28 Python
基于Pytorch版yolov5的滑块验证码破解思路详解
2021/02/25 Python
纯CSS打造(无图像无js)的非常流行的讲话(语音)气泡效果
2012/12/28 HTML / CSS
详解CSS3中的box-sizing(content-box与border-box)
2019/04/19 HTML / CSS
美国益智玩具购物网站:Fat Brain Toys
2017/11/03 全球购物
药剂专业毕业生求职信
2014/06/24 职场文书
自我介绍演讲稿范文
2014/08/21 职场文书
2014年小学语文工作总结
2014/12/20 职场文书
2015年个人招商工作总结
2015/04/25 职场文书
家长会感言
2015/08/01 职场文书
一年级下册数学教学反思
2016/02/16 职场文书
DE1103使用报告
2022/04/05 无线电
Win10服务全部禁用了怎么启动?Win10服务全部禁用解决方法
2022/09/23 数码科技