HighCharts动态高/低极端标记 [英] HighCharts dynamic high/low extreme markers
问题描述
我希望在沿着线条系列的y轴的视图中的最高点和最低点值上显示标记。我知道如何手动添加标记，但想要动态添加/删除它们，如果缩放/平移或其他任何改变可见的高/低点是否有办法知道这一点和新的高/低添加/删除标记？
以前 SO问题请求与此样机图像相似的建议： http://cl.ly/image/ 1f0m3l241e2S 。答案虽然是提供您的数据源，它不会通过缩放/平移或流数据更新。
我可能会自己循环访问数据源（2D阵列），找到高/低并设置它们，如果我只能通过数组的缩放部分进行循环，则在缩放/平移事件上执行相同操作。虽然如果我将dataGrouping设置为true，那么我所迭代的值数组可能无法正确匹配？
您可以执行这个由
$ b $ 1）使用getExtremes（）方法得到高/低数据点
2）使用afterSetExtremes（）事件捕获缩放事件并重新计算
几个可能相关的帖子：
您可以在一个函数中设置它，循环遍历数据并寻找与高/低数据点相匹配的数据点，并从它们中构建一个标记高/低数据点的散点图系列点。在图表加载和缩放上标记点的示例：
函数示例，获取放置标记匹配高/低数据点的相关x值： p>
$。each（chart.series [0] .data，function（i，point）{
if（point。 y == maxData&& point.x< = maxTime&& point.x> = minTime）{
xMax = point.x; （point.y == minData&& point.x< = maxTime&& point.x> = minTime）{
console.log（point ）;
xMin = point.x;
}
}）;
{{UPDATE：
请注意这个问题：
如果您打算使用列或区域系列，则需要从系列对象中取得最小值和最大值，而不是getExtremes（）方法，因为图表内部设置了dataMin对于这些系列类型来说，它们的值为0.
很容易适应相应的功能。 ，如果您打算使用boxplot，columnrange或其他类似的系列而没有明确的y值，那么您也必须相应地进行更新。
I am wanting to display a marker on the highest and lowest point value in view along the y axis on a line series. I know how to add a marker manually but would like to add/remove them dynamically if a zoom/pan or anything else alters the visible high/low points is there a way to know this and the new high/low to add/remove the markers?
A previous SO question asked for similar advice with this mockup image: http://cl.ly/image/1f0m3l241e2S. The answer though is providing it with your data source, which wouldn't update via zoom/pan or streaming data.
I could potentially loop through the data source myself(2D Array), find the high/low and set them, doing the same on zoom/pan events if I can loop through only the zoomed section of the array. Though if I have dataGrouping set to true, the array of values I iterate over may not match up correctly?
You can do this by
1) using the getExtremes() method to get the high/low data points
2) using the afterSetExtremes() event to capture a zoom event and recalculate
A couple of potentially relevant posts:
You can set this up in a function, to loop through your data and look for a match to the high/low data points, and from them build a scatter series marking the high/low points on the chart.
An example that marks the points both on chart load and zoom:
function sample, gets the relevant x value at which to place the marker matching the high/low data point:
$.each(chart.series[0].data, function(i,point) {
if(point.y == maxData && point.x <= maxTime && point.x >= minTime) {
xMax = point.x;
}
if(point.y == minData && point.x <= maxTime && point.x >= minTime) {
console.log(point);
xMin = point.x;
}
});
{{UPDATE:
Important to note this issue:
If you are going to use column or area series, you will need to get the min and max from the series object instead of the getExtremes() method, because the chart internally sets the dataMin to 0 for those series types.
Easy enough to adapt the function accordingly.
And on a similar note, if you are going to use a boxplot, columnrange, or other similar series without an explicit y value, you will have to update accordingly as well.
这篇关于HighCharts动态高/低极端标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
