Google 时间轴图表持续时间(以小时为单位)

2023-11-24

我正在使用 Google 时间线图表,即使持续时间超过一天,我也想以小时为单位显示持续时间。是否可以?

谢谢

包含一千个样本的图像,展示了不同的行为1正如您所看到的,红色的持续时间是错误的,蓝色的持续时间是计算和打印的。


没有配置选项更改工具提示的内容

但可以提供自定义工具提示

请参阅以下工作片段

插入工具提示列并填充数据信息

google.charts.load('current', {
  callback: function () {
    var container = document.getElementById('chart_div');
    var chart = new google.visualization.Timeline(container);

    var dataTable = new google.visualization.DataTable();
    dataTable.addColumn({type: 'string', id: 'RowLabel'});
    dataTable.addColumn({type: 'string', id: 'BarLabel'});
    dataTable.addColumn({type: 'date', id: 'Start'});
    dataTable.addColumn({type: 'date', id: 'End'});

    dataTable.addRows([
      ['165414 fine-turbo          ers', 'Cpus 24 - 0.543h', new Date(2016,07,20, 13,37,32), new Date(2016,07,20, 15,43,19)],
      ['165418 fine-turbo          ers', 'Cpus 24 - 0.534h', new Date(2016,07,20, 14,47,12), new Date(2016,07,20, 16,40,09)],
      ['165427 fine-turbo          ers', 'Cpus 24 - 0.265h', new Date(2016,07,20, 18,01,23), new Date(2016,07,21, 00,02,53)],
    ]);

    dataTable.insertColumn(2, {type: 'string', role: 'tooltip', p: {html: true}});

    var dateFormat = new google.visualization.DateFormat({
      pattern: 'M/d/yy hh:mm:ss'
    });

    for (var i = 0; i < dataTable.getNumberOfRows(); i++) {
      var duration = (dataTable.getValue(i, 4).getTime() - dataTable.getValue(i, 3).getTime()) / 1000;
      var hours = parseInt( duration / 3600 ) % 24;
      var minutes = parseInt( duration / 60 ) % 60;
      var seconds = duration % 60;

      var tooltip = '<div class="ggl-tooltip"><span>' +
        dataTable.getValue(i, 1) + '</span></div><div class="ggl-tooltip"><span>' +
        dataTable.getValue(i, 0) + '</span>: ' +
        dateFormat.formatValue(dataTable.getValue(i, 3)) + ' - ' +
        dateFormat.formatValue(dataTable.getValue(i, 4)) + '</div>' +
        '<div class="ggl-tooltip"><span>Duration: </span>' +
        hours + 'h ' + minutes + 'm ' + seconds + 's ';

      dataTable.setValue(i, 2, tooltip);
    }

    chart.draw(dataTable, {
      tooltip: {
        isHtml: true
      }
    });
  },
  packages: ['timeline']
});
.ggl-tooltip {
  border: 1px solid #E0E0E0;
  font-family: Arial, Helvetica;
  font-size: 10pt;
  padding: 12px 12px 12px 12px;
}

.ggl-tooltip div {
  padding: 6px 6px 6px 6px;
}

.ggl-tooltip span {
  font-weight: bold;
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Google 时间轴图表持续时间(以小时为单位) 的相关文章

随机推荐

  • PHP html 电子邮件,使用 html 模板

    所以我正在尝试做一个 html 邮件系统 我的 html 我想成为一个模板 存储在一个单独的文件中 例如 div div div class content div div class footer div 当我想发送邮件时 我希望我的邮件
  • 使用 POST 重定向到 POST 响应的 JQuery 表单插件文件上传

    请大家帮忙 这是一个主要的拦截器 我有一个使用 NodeJS 的项目jQuery 表单插件 我正在尝试在其中上传文件的打字稿 文件上传后 服务器会向屏幕上呈现的 POST 消息发送响应 在 POST 响应呈现在屏幕上之前 文件确实已成功且完
  • Android Gradle 插件(警告)API“variant.getMergeResources()”已过时,已替换为“variant.getMergeResourcesProvider()”

    我正在尝试构建并运行这个存储库增强图像我遇到了这个错误 引起原因 java lang RuntimeException 创建 sfa 时出错 哪个深入到这个警告警告 应用程序编程接口 variant getMergeResources is
  • OS X 上的 HAXM 不断消失

    我最近使用 El Capitan 将我的 Android 开发环境转移到了 OS X 上 一切都按预期进行 我发现的唯一问题是 每次重新启动 PC 后 HAXM 都会从 dev 中消失 并且 Android Studio 在使用 HAXM
  • 不规则形状的碰撞检测

    我知道如何检查圆是否即将与正方形碰撞 并且我知道如何检测正方形是否即将与正方形碰撞 但是我将如何检测多边形是否即将与正方形碰撞 或者更好的是 当一个多边形即将与另一个多边形碰撞时 或者更好的是 当由不直的线条组成的形状与另一个相似的形状 多
  • 在 R 中绘制回归线

    我想在 R 中绘制一条简单的回归线 我已经输入了数据 但回归线似乎不正确 有人可以帮忙吗 x lt c 10 20 30 40 50 60 70 80 90 100 110 120 y lt c 10 18 25 29 30 28 25 2
  • Scipy sigmoid曲线拟合

    我有一些数据点 想找到一个拟合函数 我想累积高斯 sigmoid 函数会适合 但我真的不知道如何实现这一点 这就是我现在所拥有的 import numpy as np import pylab from scipy optimize imp
  • 来自 Alfresco 中 WebScript 的 HTTP 请求

    我正在使用 JS 控制器在 Alfresco 中编写 WebScript 并且想向本地 HTTP 资源发出 HTTP 请求 该资源是一个基于 Java 的应用程序 并为我提供了自己的 REST API 我的 WebScript 不是共享组件
  • 如何使用 Html Agility Pack 使请求超时

    我正在向当前离线 故意 的远程 Web 服务器发出请求 我想找出使请求超时的最佳方法 基本上 如果请求运行时间超过 X 毫秒 则退出请求并返回null回复 目前 网络请求只是坐在那里等待响应 我该如何最好地解决这个问题 这是当前的代码片段
  • 将 Rust 变量传递给期望能够修改它的 C 函数

    我正在编写一个安全的 Rust 层 通过它我可以调用 Rust 中的 C 库中的函数 我已经使用生成了不安全的绑定Rust 绑定根 但我对 Rust 和 C 在传递指针方面的工作方式之间的差异感到有点困惑 C 函数如下所示 bool ime
  • VSCode 的“打开文件夹时运行”任务中的“打开文件夹时”是什么意思?

    VSCode 去年添加了一项功能 打开文件夹时 自动运行任务 但是使用工作区时 打开文件夹时 是什么意思 具体来说 如果您打开一个工作区 将会 runOn folderOpen 任务运行 如果是这样 怎么办 我这么问是因为我将一个任务配置为
  • HTML5 向后兼容 XHTML 吗?

    简短的问题 我可以将现有 XHTML 1 0 网站的 DOCTYPE 更改为 HTML5 吗 这会导致任何问题吗 很长的故事 我们有一个用 ASP NET Webforms 编写的网站 由于它相当旧 默认的 DOCTYPE 设置为 XHTM
  • 使用他的 ClassType 来转换 TObject?

    我怎样才能让我的代码工作 我试图提出这个问题 但经过几次失败的尝试后 我认为你们通过查看代码会比阅读我的 解释 更快地发现问题 谢谢 setCtrlState memo1 edit1 button1 False procedure setC
  • 带参数的 Django 重定向()

    已经有人问过几个类似的问题 但在花了很长时间后我找不到问题的答案 在下面的代码中 当我使用参数 username 从 myView 重定向到 anotherView 时 它按预期工作正常 但我也需要在此重定向中包含 范围 参数 因为重定向后
  • Android 中强制通过扬声器输出声音

    Android 有没有办法强制通过手机扬声器输出 即使耳机已插入插孔 我知道必须有一种方法 因为当您打电话时 即使插孔中插入了耳机 您也可以让某人使用免提电话 您可以使用以下命令在系统范围内更改此设置AudioManager setSpea
  • oo问题-混合控制器逻辑和业务逻辑

    我不确定我是否使用 标准 术语 但这是我试图解决的一个基本的面向对象问题 我正在编写一个 Windows 窗体 我不需要表单事件处理程序中的逻辑 因此我只需从那里调用自定义对象 在自定义对象中 有两组逻辑 控制器 逻辑 决定需要完成什么以及
  • 编译器生成的默认构造函数会是公共的吗?

    当我写一个类的时候Widget java public class Widget int data String name 编译器生成的构造函数是public or default 公众会像 public class Widget int
  • HTML 中的方括号形成数组。只是传统的还是有意义的?

    我经常看到 特别是在 PHP 世界中 如果你想创建一个 FORM 数组 可以这样写
  • 如何将 Firebase 身份验证令牌传递给 webView 并在 Android 上注册通知

    我有一个 Firebase WebApp 它向用户提供信息 除了应用程序之外 我还需要通过 Firebase 云消息传递向使用 Android 应用程序的用户发送推送通知 目标 用户应该一次登录到应用程序 既可以注册通知 又可以通过 Web
  • Google 时间轴图表持续时间(以小时为单位)

    我正在使用 Google 时间线图表 即使持续时间超过一天 我也想以小时为单位显示持续时间 是否可以 谢谢 包含一千个样本的图像 展示了不同的行为1正如您所看到的 红色的持续时间是错误的 蓝色的持续时间是计算和打印的 没有配置选项更改工具提