具有HighCharts的多个系列时间轴

Question

想要看看这张图表是否可以在跳过任何JS图表库之前使用HighCharts - 所有建议都非常赞赏,例如建议可以明确支持我需要的替代方案.

• X轴是一个简单的时间轴.
• Y轴将有各种类别(标签左侧和右侧)
• 对于每个类别,我将有零到多个具有开始和结束日期的事件
• 我希望有一个很好的水平线代表每个类别(仅显示,没有数据)
• 在每一行,我想显示一个更粗的条形代表事件,从开始到结束日期.

听起来不太复杂,但我还没有在Tinterweb的任何地方看到这种图形的例子.

提前谢谢,蒙蒂

Answer 1

• X轴是一个简单的时间轴.

作为日期时间的X轴工作得很好.根据显示图表的时间跨度,它将自动格式化标签.您可以使用dateTimeLabelFormats和tickInterval修改默认格式.日期时间可以控制在毫秒级.

• Y轴将有各种类别(标签左侧和右侧)

您可以根据需要使用多个Y轴.您可以将它们放在图表的任一侧或两侧.以下是具有两个Y轴的图表的示例.您还可以在图表上拥有所需数量的系列.您可以将它们中的每一个绑定到特定的Y轴,并根据需要为它们提供所有不同的类型(前样条曲线,条形图,饼图等).

• 对于每个类别,我将有零到多个具有开始和结束日期的事件

如果您的数据点没有任何数据,则可以将其指定为null.然后继续处理包含数据的数据点.

• 我希望有一个很好的水平线代表每个类别(仅显示,没有数据)
• 在每一行,我想显示一个更粗的条形代表事件,从开始到结束日期.

我想你在这里指的是网格线.如果是这样,那么您可以更改 gridLineWidth.您也可以更改颜色,如果需要,您可以添加次要网格线并根据需要操作它们.这可以在任一轴上或两者上完成.

• 补充说明

您还可以将其他数据发送到某个点,以便在工具提示中显示.这表现在这里.在示例中,锁定,解锁和潜在是用户定义的变量.您可以在图表中绘制对象.您可以使图表可缩放.您可以深入查看图表以显示基于数据元素的其他数据.而这样的例子不胜枚举.你可以做很多事情.如果所有其他方法都失败了,您可以添加自己的自定义事件和功能来控制其他任

如果我对任何内容有疑问,我会通过参考或演示进行搜索.如果我仍然无法弄清楚如何做某事我会问这里并得到一个对我有用的答案.