【发布时间】：2014-07-23 18:34:01
【问题描述】：
我正在尝试创建一个包含两个部分的图表；顶部是一个水平条形图，显示左侧的类别。第二个较低的图表将是一个样条图，在右侧显示值，并且两个图表都将使用时间的 x 轴。
我正在尝试将 HighStock 图表的格式设置为如下所示： http://fiddle.jshell.net/revive/n4H8U/show/light/
这是我的 WIP：http://jsfiddle.net/revive/g4KLk/
顶部的类别栏将充当“指示器”，以显示该类别在该时间段内是打开还是关闭。
The bottom section shows various speed measurements, over the same time frame.
而且，我尝试使用 HighStocks 图表进行这项工作的原因是我需要底部的缩放/平移导航器：D
非常感谢任何反馈，因为我已经尽我所能在 API 中以我目前对它的理解......仍在学习它！
谢谢！
编辑
也许我最好定义我想要完成的最终结果，因为很可能有更好的方法来实现它。
显然我拥有的两个图表数据集是基于时间的——它们都有一段时间内的数据点。
我需要让用户能够根据时间线查看图表。能够“放大”（因此希望在 HighStocks 中使用导航器），然后选择一个数据点作为“开始时间”，另一个作为“结束时间”，这样我们就可以根据新选择的时间返回其他数据框架。
这是一个活生生的例子：
假设您录制了一段超过 2 小时的音频或视频，并附有其他数据来显示您的相机灯、运动检测器、闪光灯等处于活动状态的时间/多长时间。使用此图表，您可以滚动浏览数据（顶部图表显示代表相机灯、运动检测器等与时间相关的状态的条形图，底部图表显示 DB 中的声级 - 两个图表共享相同的时间线 - xAxis）。
这样，您可以使用导航器放大该 2 小时窗口内的特定时间范围。然后确定特定事件发生的时间（例如，运动检测器从 1:33:00 到 1： 48:29）并且您想“提取”这两个时间标记以在其他地方使用..
与大多数复杂的 UI 模式一样。描述起来相当困难，但在实践中使用起来非常简单：D
【问题讨论】：
-
你能把完整的小提琴发给我们看看你的代码吗？您是否尝试过在 WIP 图表中使用“条形图”作为顶部图表？如果你这样做会发生什么？
-
你有两个完全不同的 xAxis，第一个是从 0 到 32 的数字，但第二个是日期时间（以毫秒为单位的时间），它的值是 12392992000，所以要映射它吗？什么时候是4号？
-
嗨@SebastianBochan，感谢您的快速回复！不同的 Axis 是由于我对 HighCharts API 缺乏了解 - 仍在阅读它。两个图表的底部轴应该是时间（通常在很短的跨度内，但最多几个小时。）。因为我需要在顶部使用水平条形图，所以我意识到轴是翻转的——xAxis 是左边，yAxis 是底部。因此，这样顶部的垂直条形图将需要：xAxis：状态值，yAxis：时间，然后图表将是：xAxis：时间 yAxis：速度值正确吗？
-
主要是，我无法理清如何允许在股票图表上方使用垂直条形图。所以两者都可以使用导航器。
-
查看示例jsfiddle.net/X8Crp/8，它使来自 highstock 的导航器成为您的目标，希望它是您的目标
标签： jquery highcharts highstock