纯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 动态添加表格行
Jun 22 Javascript
更正确的asp冒泡排序
May 24 Javascript
jquery教程限制文本框只能输入数字和小数点示例分享
Jan 13 Javascript
jQuery控制div实现随滚动条滚动效果
Jun 07 Javascript
jQuery实现的右下角广告窗体跟随效果示例
Sep 16 Javascript
几种tab切换详解
Feb 03 Javascript
JS字符串长度判断,超出进行自动截取的实例(支持中文)
Mar 06 Javascript
详解Angular2 之 结构型指令
Jun 21 Javascript
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 jQuery
详解vue-cli中的ESlint配置文件eslintrc.js
Sep 25 Javascript
简单理解Vue中的nextTick方法
Jan 30 Javascript
Vue 3.0中jsx语法的使用
Nov 13 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
什么是短波收听SWL
2021/03/01 无线电
Discuz! 5.0.0论坛程序中加入一段js代码,让会员点击下载附件前自动弹出提示窗口
2007/04/18 PHP
destoon调用企业会员公司形象图片的实现方法
2014/08/21 PHP
PHP的Laravel框架中使用消息队列queue及异步队列的方法
2016/03/21 PHP
通过MSXML2自动获取QQ个人头像及在线情况(给初学者)
2007/01/22 Javascript
js 效率组装字符串 StringBuffer
2009/12/23 Javascript
jQuery实现拖拽可编辑模块功能代码
2017/01/12 Javascript
微信小程序 实现动态显示和隐藏某个控件
2017/04/27 Javascript
微信小程序实现导航栏选项卡效果
2020/06/19 Javascript
基于vue2.0动态组件及render详解
2018/03/17 Javascript
详解Ant Design of React的安装和使用方法
2018/12/27 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
layui 关闭open弹出框 刷新table表格页面的方法
2019/09/16 Javascript
JavaScript实现轮播图效果代码实例
2019/09/28 Javascript
小程序外卖订单界面的示例代码
2019/12/30 Javascript
vue将data恢复到初始状态 && 重新渲染组件实例
2020/09/04 Javascript
vue中使用vue-pdf的方法详解
2020/09/05 Javascript
Pycharm学习教程(1) 定制外观
2017/05/02 Python
利用Python批量提取Win10锁屏壁纸实战教程
2018/03/27 Python
python处理csv中的空值方法
2018/06/22 Python
Python函数参数操作详解
2018/08/03 Python
pandas之分组groupby()的使用整理与总结
2020/06/18 Python
详解HTML5中download属性的应用
2015/08/06 HTML / CSS
使用HTML5 Canvas API控制字体的显示与渲染的方法
2016/03/24 HTML / CSS
在html页面中取得session中的值的方法
2020/08/11 HTML / CSS
匡威德国官网:Converse德国
2019/01/26 全球购物
西班牙语在线票务市场:SuperBoletería
2019/06/10 全球购物
澳大利亚购买健身器材网站:Gym Direct
2019/12/19 全球购物
企业元宵节主持词
2014/03/25 职场文书
环保建议书200字
2014/05/14 职场文书
2014年预备党员端正入党动机思想汇报
2014/09/13 职场文书
爱心捐书倡议书
2015/04/27 职场文书
如何写观后感
2015/06/19 职场文书
宿舍管理制度范本
2015/08/07 职场文书
Android studio 简单计算器的编写
2022/05/20 Java/Android
Python find()、rfind()方法及作用
2022/12/24 Python