在具有时间序列的 Flot 图表中堆叠条形图

发布于 2024-12-08 02:42:11 字数 142 浏览 0 评论 0原文

我有一张流程图,x 轴显示时间 - 刻度大小等于一天。我正在显示一天中不同时间发生的事件的持续时间,我想将它们堆叠起来。 Flot 的时间模式根据毫秒定位条形,因此条形在每个报价/天中都是分开的。有没有一种快速方法可以使条形堆叠起来,防止它们每天绘制在不同的 x 位置?

I have a Flot chart and x-axis displays time - tick size equaling one day. I am displaying durations of events that take place at various times of the day and I would like to stack them. Flot's time mode positions the bars based on milliseconds so the bars are apart in each tick/day. Is there a quick way of making the bars stack up, preventing them from being plotted in different x positions in each day?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

人事已非 2024-12-15 02:42:11

回答我自己的问题心情复杂,但无论如何我都会这样做,以防有人遇到类似的问题。

解决方案是将时间戳转换为天,舍入结果中的小数,然后使用如下函数将其转换回毫秒:

Math.floor(日期/(1000*60*60*24))*(1000*60*60*24)

另外,请确保在轴设置声明中将刻度大小设置为一天:

tickSize:[1,“天”]

因此,您最终会得到完美叠加的日期值。我最终在客户端进行了转换,以便我可以存储精确的值,而图表则显示更大的图片。

Having mixed feelings answering my own question, but I'll do it anyway in case someone runs into a similar issue.

The solution is to convert timestamps to days, round down the decimal in the result, and convert it back to milliseconds using a function like:

Math.floor(date/(1000*60*60*24))*(1000*60*60*24)

Also, make sure to set the tick size to one day in your axis settings declaration:

tickSize: [1, "day"]

As a result, you will end up with day values that stack up beautifully. I ended up doing the conversion on the client side so that I can store precise values, while the graph shows a bigger picture.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文