纯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 相关文章推荐
破除一些网站复制、右键限制
Nov 04 Javascript
jquery下checked取值问题的解决方法
Aug 09 Javascript
杨氏矩阵查找的JS代码
Mar 21 Javascript
使用struts2+Ajax+jquery验证用户名是否已被注册
Mar 22 Javascript
Vue.js移动端左滑删除组件的实现代码
Sep 08 Javascript
基于js中的原型(全面讲解)
Sep 19 Javascript
JavaScript内置对象math,global功能与用法实例分析
Jun 10 Javascript
15 分钟掌握vue-next响应式原理
Oct 13 Javascript
vue单元格多列合并的实现
Nov 26 Vue.js
Vue中引入svg图标的两种方式
Jan 14 Vue.js
原生js实现下拉框选择组件
Jan 20 Javascript
JavaScript使用canvas绘制坐标和线
Apr 28 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制作静态网站的模板框架(二)
2006/10/09 PHP
php mysql 封装类实例代码
2016/09/18 PHP
Javascript写了一个清除“logo1_.exe”的杀毒工具(可扫描目录)
2007/02/09 Javascript
Google (Local) Search API的简单使用介绍
2013/11/28 Javascript
JQuery简单实现锚点链接的平滑滚动
2015/05/03 Javascript
JavaScript中数组继承的简单示例
2015/07/29 Javascript
jquery通过扩展select控件实现支持enter或focus选择的方法
2015/11/19 Javascript
深入浅析jQuery对象$.html
2016/08/22 Javascript
jQuery Mobile和HTML5开发App推广注册页
2016/11/07 Javascript
基于vue的下拉刷新指令和滚动刷新指令
2016/12/23 Javascript
jQuery控制元素隐藏和显示
2017/03/03 Javascript
jQuery插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
2017/03/23 jQuery
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
微信小程序对接七牛云存储的方法
2017/07/30 Javascript
详解Angular5路由传值方式及其相关问题
2018/04/28 Javascript
vue使用v-for实现hover点击效果
2018/09/29 Javascript
小程序指纹验证的实现代码
2018/12/04 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
python进阶教程之循环对象
2014/08/30 Python
python如何拆分含有多种分隔符的字符串
2018/03/20 Python
python skimage 连通性区域检测方法
2018/06/21 Python
Tensorflow 同时载入多个模型的实例讲解
2018/07/27 Python
Python向excel中写入数据的方法
2019/05/05 Python
用Python配平化学方程式的方法
2019/07/20 Python
Python 异常处理Ⅳ过程图解
2019/10/18 Python
Python实现平行坐标图的绘制(plotly)方式
2019/11/22 Python
利用pandas将非数值数据转换成数值的方式
2019/12/18 Python
Python多进程编程multiprocessing代码实例
2020/03/12 Python
python实现密码强度校验
2020/03/18 Python
Melijoe美国官网:法国奢侈童装购物网站
2017/04/19 全球购物
JavaScript获取当前url根目录(路径)
2014/02/19 面试题
2014年党员干部四风问题自我剖析材料
2014/09/29 职场文书
小英雄雨来观后感
2015/06/09 职场文书
导游词之韩国济州岛
2019/10/28 职场文书
python如何做代码性能分析
2021/04/26 Python
分享Python异步爬取知乎热榜
2022/04/12 Python