Jquery 结合水平条形图和股票图（带导航器）高图

我试图创建一个包含两个部分的图形；顶部是一个水平条形图，显示左侧的类别。第二个较低的图形将是一个样条曲线图，显示右侧的值，两个图形都将使用时间的x轴

我正在尝试将HighStock图表的格式设置为如下所示：

这是我的WIP：

顶部的类别栏将作为“指示器”，显示该类别在该时间段内是打开还是关闭

The bottom section shows various speed measurements, over the same time frame.

我之所以尝试在HighStocks图表中使用这个功能，是因为我需要底部的缩放/平移导航器：D

非常感谢您的任何反馈，因为我已经在API中尽我所能，以我目前对它的理解。。还在学呢

谢谢

编辑 也许我最好定义一下我试图实现的最终结果，因为很可能有更好的方法

显然，我拥有的两个图形数据集是基于时间的——它们都有一段时间内的数据点

我需要的是用户能够根据时间线查看图表。能够“放大”（因此希望在HighStocks中使用Navigator），然后选择一个数据点作为“开始时间”，另一个作为“结束时间”，以便我们可以根据新选择的时间框架返回其他数据

下面是一个活生生的例子： 假设您在2小时内录制了一段音频或视频，并提供了额外的数据，以显示您的相机灯光、运动检测器、闪光灯等的活动时间/持续时间。使用此图，您可以滚动浏览数据（顶部的图显示与时间相关的表示摄像机灯光、运动检测器等状态的条形图，底部的图显示以DB为单位的声级-两个图共享相同的时间线-xAxis）

这样，您可以使用导航器在2小时窗口内放大特定的时间范围。。然后确定特定事件发生的时间（例如，运动检测器在1:33:00到1:48:29之间处于活动状态），您希望“提取”这两个时间标记以供其他地方使用

---

与大多数复杂的UI模式一样。。这很难描述，但实际上使用起来非常简单：D

和另一位开发人员（在JSAPI方面更为精明）一起，我们能够整理出完成这一任务所需的图表设置。您可以在此处看到完整的图表：

---

你能把整把小提琴发过来让我们看看你的代码吗？您是否尝试过在WIP图的顶部图表中使用“条形图”？如果这样做会发生什么？有两个完全不同的X轴，第一个是0到32之间的数字，第二个是datetime（时间单位为毫秒），它的值是12392992000，所以要映射它吗？i.e.4号是几点？嗨@SebastianBochan，谢谢你的快速回复！不同的轴心是由于我对HighCharts API缺乏了解——仍在阅读它。两个图表的底轴都应该是时间（通常在短时间内，但最多几个小时）。因为我需要在顶部使用水平条形图，所以我意识到轴是翻转的——xAxis是左侧，yAxis是底部。因此，这将使顶部的垂直条形图需要：xAxis:status value，yAxis:time，然后该图表将是：xAxis:time yAxis:speed value。这是否正确？主要是，我无法解决如何允许在股票图表上方使用垂直条形图。。所以两者都可以使用导航器。请参阅从highstock启用导航器的示例，希望这是您的目标