Highcharts的基本属性和方法详解
Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习、个人网站和非商业用途使用。
目前HighCharts支持的图表类型有曲线图、区域图、柱状图、饼状图、散状点图和综合图表。
HighCharts界面美观,由于使用JavaScript编写,所以不需要像Flash和Java那样需要插件才可以运行,而且运行速度快。另外HighCharts还有很好的兼容性,能够完美支持当前大多数浏览器。
下面给出实例并详解分析他们:
1 |
<script type="text/javascript" src="js/jquery.min.js"></script><script type="text/javascript" src="js/highcharts.js"></script><script type="text/javascript">var chart; |
一.chart的部分相关属性说明
1 |
renderTo: 'container', //图表的页面显示容器(也就是要显示到的div) |
二. credits的部分相关属性说明
1 |
credits: //设置右下角的标记。highchart.com (这个也可以在highcharts.js里中修改){//enabled: true, //是否显示 |
三. title的部分相关属性说明
1 |
title: //标题{ |
四. xAxis或者YAxis的部分相关属性说明
1 |
categories: ['一月', '二月'],//allowDecimals: false//alternateGridColor: 'red' //在图表中相隔出现纵向的颜色格栅//dateTimeLabelFormats: ,//endOnTick: false, //是否显示控制轴末端的一个cagegories出来//events: {//setExtremes://},//gridLineColor: "red", //纵向格线的颜色//gridLineDashStyle: Solid //纵向格栅线条的类型//gridLineWidth: 5, //纵向格线的的大小//id: null,//labels: { //X轴的标签(下面的说明)//align: "center", //位置//enabled: false, //是否显示//formatter: ,//rotation: 90, //旋转,效果就是影响标签的显示方向//staggerLines: 4, //标签的交错显示(上、下)//step: 2, //标签的相隔显示的步长//style:{},//x: 100, //偏移量,默认两个都是0,//y: 40//},//lineColor: "red", //X轴的颜色//lineWidth: 5, //X轴的宽度//linkedTo:1,//opposite: true //是否把标签显示到对面//max: 12, //显示的最大值//maxPadding: 6,//maxZoom: 1,//min: 10, //显示的最小值//minorGridLineColor: 'red', //副格线的颜色//minorGridLineDashStyle: 'blod', //副格线的的颜色//minorGridLineWidth: 50, //副格线的宽度//minorTickColor: #A0A0A0, //没有看出效果 |
五.tooltip的部分相关属性说明
1 |
tooltip: //提示框设置{ |
六.legend(图例说明)的部分相关属性说明
1 |
legend: //图例说明{//layout: 'vertical', //图例说明布局(垂直显示,默认横向显示) |
七. plotOptions的部分修改属性说明
1 |
plotOptions:{ |
如果有什么不懂的,或者不会做的,可以给我留言。
本文链接:http://www.aimks.com/basic-properties-and-methods-rounding-highcharts.html
Highcharts的基本属性和方法详解的更多相关文章
- RabbitMQ 相关概念和方法详解
名词解释 ConnectionFactory: 与 RabbitMQ 服务器连接的管理器. Connection: 与 RabbitMQ 服务器的连接. Channel: 与 Exchange 的连接 ...
- session的使用方法详解
session的使用方法详解 Session是什么呢?简单来说就是服务器给客户端的一个编号.当一台WWW服务器运行时,可能有若干个用户浏览正在运正在这台服务器上的网站.当每个用户首次与这台WWW服务器 ...
- Kooboo CMS - Html.FrontHtml[Helper.cs] 各个方法详解
下面罗列了方法详解,每一个方法一篇文章. Kooboo CMS - @Html.FrontHtml().HtmlTitle() 详解 Kooboo CMS - Html.FrontHtml.Posit ...
- HTTP请求方法详解
HTTP请求方法详解 请求方法:指定了客户端想对指定的资源/服务器作何种操作 下面我们介绍HTTP/1.1中可用的请求方法: [GET:获取资源] GET方法用来请求已被URI识别的资源.指定 ...
- ecshop后台增加|添加商店设置选项和使用方法详解
有时候我们想在Ecshop后台做个设置.radio.checkbox 等等来控制页面的显示,看看Ecshop的设计,用到了shop_config这个商店设置功能 Ecshop后台增加|添加商店设置选项 ...
- (转)Spring JdbcTemplate 方法详解
Spring JdbcTemplate方法详解 文章来源:http://blog.csdn.net/dyllove98/article/details/7772463 JdbcTemplate主要提供 ...
- C++调用JAVA方法详解
C++调用JAVA方法详解 博客分类: 本文主要参考http://tech.ccidnet.com/art/1081/20050413/237901_1.html 上的文章. C++ ...
- windows.open()、close()方法详解
windows.open()方法详解: window.open(URL,name,features,replace)用于载入指定的URL到新的或已存在的窗口中,并返回代表新窗口的Win ...
- CURL使用方法详解
php采集神器CURL使用方法详解 作者:佚名 更新时间:2016-10-21 对于做过数据采集的人来说,cURL一定不会陌生.虽然在PHP中有file_get_contents函数可以获取远程 ...
随机推荐
- xampp搭建服务器环境、html5新的input类型
怎么让别人看见你写的 先把你的文档放入htdocs里面 再输入网址: http://你的IP地址/文件名 就ok了例如我的 HTML5中的input类型: <input>标签规定用户可输入 ...
- weblogic被锁解决方案
weblogic被锁,无法启动. 解决方案:http://blog.csdn.net/zhengqiqiqinqin/article/details/17025741
- linux 执行php文件
/opt/php5/bin/php /home/Xcar/tag/interface/tag_api4hbase.php tag_export2file "/tmp/guo.php" ...
- 【转】HTML,CSS,font-family:中文字体的英文名称 (宋体 微软雅黑)
宋体 SimSun 黑体 SimHei 微软雅黑 Microsoft YaHei 微软正黑体 Microsoft JhengHei 新宋体 NSimSun 新细明体 PMingLiU 细明体 Ming ...
- 浏览器渲染原理--reflow
Web页面运行在各种各样的浏览器当中,浏览器载入.渲染页面的速度直接影响着用户体验简单地说,页面渲染就是浏览器将html代码根据CSS定义的规则显示在浏览器窗口中的这个过程.先来大致了解一下浏览器都是 ...
- SVN Unable to connect to a repository at URL
方法一:右键菜单的“TortoiseSVN”->“Settings”->“Save Data”对话框中,点击“Authentication data”旁的“Clear”按钮,清除登录凭证. ...
- socket编程概述
一.基本流程如下: 整个TCP过程非常类似于电话系统.TCP是有两个不同主机上的进程需要进行通信,电话系统是有两个人位于不同地区的人需要进行通信. socket:获得可用于进程通信的端点.由于Linu ...
- C++C++ 指针(二)--c++ 指针(二)--c++
一.内存管理:new和delete 1.new操作符:从操作系统获得内存块,并返回该内存块的首地址. delete操作符:将new申请的内存返还给操作系统. 开始一个简单的例子: #include & ...
- 解决 “fatal error C1083: ”无法打开包括文件
添加该项目的附加路径 . 1)右键查看该项目的属性 2)点击配置属性——〉 C/C++ ——〉 常规 ——〉 附加包含目录——〉将缺失文件所在目录添加进去
- SharePoint 2013 开发——概述
博客地址:http://blog.csdn.net/FoxDave 近来阅读SharePoint 2013开发一书,带着与大家一起分享其中的内容. 部署场景: 本地部署(On-Premise D ...