情节带目标是两个窗格中的一个 [英] plotbands target one of the two panes
问题描述
您好我正在使用 http：//www.highcharts。 com / stock / demo / candlestick-and-volume
i然后把一个plodBands放到那个图表中，发生了什么事情是Band影响yAxis就像在这里 http://jsfiddle.net/6sqEd/ 我注意到这个图表只有一个xAxis。
我怎样才能让这PlotBands只有第一个yAxis不是两个？
这里是代码：
$（function（）{
$ .getJSON（'http://www.highcharts.com/samples/data/jsonp.php?filename=aapl- ohlcv.json& callback =？'，函数（data）{
//将数据集分成ohlc和音量
var ohlc = []，
音量= []，
dataLength = data.length;
对于（i = 0; i
data [i] [0]，//日期
data [i] [1] ，//打开
data [i] [2]，// high
data [i] [3]，// low
data [i] [4] // close
$ b data.push（[
data [i] [0]，//日期
data [i] [5] //音量
]）
}
//创建图表
图表= new Highcharts.StockChart（{
图表：{
renderTo：'container'，
alignTicks：false
}，
rangeSelector：{
selected：5
}，
title：{
text：'AAPL Historical'
}，
xAxis：[{
plotBands：[{
from：1115856000000，
to：1128384000000，
color：'rgba（68，170，213，0.2）'，
标签：{
text：'上一季度的价值范围'
}
}]
}]，
yAxis：[{
title：{
text：'OHLC'
}，
height：200，
lineWidth：2
}，{
title：{
text：'Volume'
}，
top：300，
height：100，
offset：0，
lineWidth：2
}]，
系列：[{
type： '烛台'，
名称：'AAPL'，
数据：ohlc，
}，{
类型：'列'，
名称：''卷'，
data：volume，
yAxis：1，
}]
}）;
}）;
}）;
一个plotBand到yAxis您可以设置更高和更低的点。
如果您将plotBand放在xAxis上，它将显示在所有yAxis上。
所以如果您想绘制只是在第一轴上，可能你必须制作一个新的系列，并且有相同的plotBand风格并添加它。
第一：您必须从开始日期到结束日期创建一个区域系列，所有值将与该窗格的最大值相同。在我的示例中，它是800.
第二：确保最大值高于您系列的最高值。 II在我的示例中没有这样做，所以您必须在代码中执行此操作。
第三：从图例和工具提示中移除serie，将enableMouseTracking和showInLegend为false。
hi i am using the two panes chart http://www.highcharts.com/stock/demo/candlestick-and-volume i then put a plodBands to that chart , what happened is the Band affect both yAxis like in here http://jsfiddle.net/6sqEd/ what i have noticed is this chart has only one xAxis .
How can i make this PlotBands arget only the first yAxis Not BOTH ???
here is the code :
$(function() {
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl- ohlcv.json&callback=?', function(data) {
// split the data set into ohlc and volume
var ohlc = [],
volume = [],
dataLength = data.length;
for (i = 0; i < dataLength; i++) {
ohlc.push([
data[i][0], // the date
data[i][1], // open
data[i][2], // high
data[i][3], // low
data[i][4] // close
]);
volume.push([
data[i][0], // the date
data[i][5] // the volume
])
}
// create the chart
chart = new Highcharts.StockChart({
chart: {
renderTo: 'container',
alignTicks: false
},
rangeSelector: {
selected: 5
},
title: {
text: 'AAPL Historical'
},
xAxis:[{
plotBands : [{
from : 1115856000000,
to : 1128384000000,
color : 'rgba(68, 170, 213, 0.2)',
label : {
text : 'Last quarter\'s value range'
}
}]
}],
yAxis: [{
title: {
text: 'OHLC'
},
height: 200,
lineWidth: 2
}, {
title: {
text: 'Volume'
},
top: 300,
height: 100,
offset: 0,
lineWidth: 2
}],
series: [{
type: 'candlestick',
name: 'AAPL',
data: ohlc,
}, {
type: 'column',
name: 'Volume',
data: volume,
yAxis: 1,
}]
});
});
});
When you add a plotBand to the yAxis you can set just higger and lower points.
If you put the plotBand on the xAxis it will be displayed on all yAxis.
So if you want to plot just on the first axis probably you have to make a new serie with the same style of a plotBand an add to it.
First: You've to create an area serie from the start date to the end date wich all values will be the same of the maximum value of the pane. In my example it's 800.
Second: Make sure the maximum value is higher than the highest value of your serie. II didn't do it in my example, so you have to do it on your code.
Third: Remove the serie from the legend and from the tooltip setting the enableMouseTracking and showInLegend to false.
这篇关于情节带目标是两个窗格中的一个的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
