纯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 相关文章推荐
超强的IE背景图片闪烁(抖动)的解决办法
Sep 09 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
Jan 21 Javascript
JavaScript实现多维数组的方法
Nov 20 Javascript
js超时调用setTimeout和间歇调用setInterval实例分析
Jan 28 Javascript
浅谈jQuery构造函数分析
May 11 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
Dec 13 Javascript
JS组件系列之使用HTML标签的data属性初始化JS组件
Sep 14 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
Jan 19 Javascript
BOM之navigator对象和用户代理检测
Feb 10 Javascript
解决Vue 浏览器后退无法触发beforeRouteLeave的问题
Dec 24 Javascript
vue如何实现动态加载脚本
Feb 05 Javascript
微信小程序使用GoEasy实现websocket实时通讯
May 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
PHP has encountered an Access Violation
2007/01/15 PHP
php中判断文件存在是用file_exists还是is_file的整理
2012/09/12 PHP
解决PHP 7编译安装错误:cannot stat ‘phar.phar’: No such file or directory
2017/02/25 PHP
Laravel框架中VerifyCsrfToken报错问题的解决
2017/08/30 PHP
Yii 使用intervention/image拓展实现图像处理功能
2019/06/22 PHP
Javascript模板技术
2007/04/27 Javascript
javascript &&和||运算法的另类使用技巧
2009/11/28 Javascript
js 自定义的联动下拉框
2010/02/07 Javascript
JavaScript程序员应该知道的45个实用技巧
2014/03/04 Javascript
浅析javascript 定时器
2014/12/23 Javascript
javascript用函数实现对象的方法
2015/05/14 Javascript
简单模拟node.js中require的加载机制
2016/10/27 Javascript
javascript动画系列之模拟滚动条
2016/12/13 Javascript
Bootstrap导航中表单简单实现代码
2017/03/06 Javascript
javascript 动态生成css代码的两种方法
2017/03/17 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
使用mixins实现elementUI表单全局验证的解决方法
2019/04/02 Javascript
layui 实现自动选择radio单选框(checked)的方法
2019/09/03 Javascript
vue-cli3跨域配置的简单方法
2019/09/06 Javascript
vue 解决异步数据更新问题
2019/10/29 Javascript
three.js 利用uv和ThreeBSP制作一个快递柜功能
2020/08/18 Javascript
[50:45]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第一场
2018/04/10 DOTA
使用graphics.py实现2048小游戏
2015/03/10 Python
Python使用内置json模块解析json格式数据的方法
2017/07/20 Python
Python从数据库读取大量数据批量写入文件的方法
2018/12/10 Python
pytorch实现onehot编码转为普通label标签
2020/01/02 Python
python except异常处理之后不退出,解决异常继续执行的实现
2020/04/25 Python
python实现按日期归档文件
2021/01/30 Python
html5小程序飞入购物车(抛物线绘制运动轨迹点)
2020/10/19 HTML / CSS
护士自我评价
2014/02/01 职场文书
元旦活动感言
2014/03/08 职场文书
委托证明模板
2014/09/16 职场文书
颐和园英文导游词
2015/01/30 职场文书
爱岗敬业事迹材料
2019/06/20 职场文书
《没有任何借口》读后感:完美的执行能力
2020/01/07 职场文书
golang中切片copy复制和等号复制的区别介绍
2021/04/27 Golang