Highcharts-以编程方式;翻转“;(反转)Y轴
Highcharts - programmatically "flip" (reverse) Y Axis
全部,
我在一个正在开发的网络应用程序中使用Highcharts。其中一个要求是用户应该能够点击按钮并"翻转"或反转Y轴。
换句话说,当用户点击一个按钮时,y轴值应该从以下位置翻转:
highest at the top / lowest at the bottom
至
lowest at the top / highest at the bottom
当你第一次创建图表时,这可以使用y轴的"反转"属性:
http://api.highcharts.com/highcharts#yAxis.reversed
此处的示例:http://jsfiddle.net/ZgVNS/
然而,如果我尝试使用选项对象(例如,单击按钮(通过JavaScript编程实现这一点,它似乎不起作用:
chart.options.yAxis.reversed = !chart.options.yAxis.reversed;
chart.redraw();
这里有一个我设置用来测试的jsfiddle:http://jsfiddle.net/4JZxS/6/
这可能吗?
提前感谢!
您可以使用Axis.update((方法:
$(function () {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
reversed: false
},
series: [{
data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
}]
});
var reversed = chart.options.yAxis.reversed;
// the button action
$('#button').click(function () {
chart.yAxis[0].update({
reversed: !reversed
});
reversed = !reversed;
});
});
以下是更新后的JSFiddle:http://jsfiddle.net/4JZxS/15/
我认为这是不可能的。
我的建议是使用chart.destroy()
销毁图表,并创建具有反向属性的新图表,就像这个小提琴
相关文章:
- 通过点击按钮翻转缩略图
- JavaScript按钮/输入/函数,字符串反转
- IE中的CSS翻转动画:翻转的一面显示镜像内容
- 使用prompt时反转数组
- 如何按对象反转Angular ngRepeat的顺序's键,这些键是数字键
- 使用正则表达式反转字符串中的元音
- IE中的CSS翻转动画:翻转的一面显示镜像内容
- 反转数组
- 什么CSS/JS技巧驱动镜像反转http://com.google愚人节页面
- CSS3卡翻转动画,检测是否不支持
- 如何反转表的行顺序
- 就地反转数组为什么不起作用
- 卡片翻转动画InternetExplorer11
- 如何使用拉斐尔自由变换翻转图像
- 从带有皮肤的3ds MAX导入后,我的游戏中网格将反转为一体
- 在JQuery中将页面翻转转换为自定义url
- 反转一个数组,该数组是Javascript中对象中的一个值
- 只翻转一个DIV,而不是所有DIV都属于同一类
- 弧度有时翻转/反转
- Highcharts-以编程方式;翻转“;(反转)Y轴