首页 > 其他 > 详细

Highchart构建横向误差条图

时间：2015-08-10 12:04:08      阅读：195      评论：0      收藏：0      [点我收藏+]

Highchart构建横向误差条图

普通误差条图只能表现竖直方向的误差范围。但很多时候，还需要表现该数值在水平方向的误差范围。这个时候，可以使用第三方插件error_bar实现。该插件为用户提供了一个新的图表类型error_bar。使用横向误差条图的过程如下：
（1）从Github下载该插件，网址为https://github.com/youngmd/highcharts-errorbar/archive/master.zip。解压该文件，获取其中的脚本文件highcharts-errorbar.js。
（2）在当前网页中，引入该脚本文件。代码如下：
  • <script src=”highcharts-errorbar.js”></script>
（3）在数据列中指定图表类型为error_bar。代码如下：
  • series:[{
  • type:’error_bar’
  • }]
（4）构建对应的节点。其节点构成语法如下：
  • [x,y,left,right,low,high]
其中，参数x和y指定节点位置；参数left和right指定横向误差值；参数low和right指定纵向误差值。
（5）使用配置项format指定显示模式。其语法如下：
  • format:String
其中，参数String指定显示那条误差线。允许的值包括x（只显示横向误差线）、y（只显示纵向误差现）、xy（同时显示横向和纵向误差线）。默认值为xy。

创建实例效果如下：

技术分享
横向误差条图

PS：该内容已经加入《网页图表Highcharts实践教程图表篇》v1.2.5中。

版权声明：本文为博主原创文章，未经博主允许不得转载。

Highchart构建横向误差条图

原文：http://blog.csdn.net/jsbome/article/details/47395519
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
分享档案
更多>
2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)
最新文章
更多>
教程昨日排行
更多>
友情链接
汇智网   PHP教程   插件网  
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣，分享程序人生！