用闪亮的 R 设计 DT 中的展开行按钮

2024-05-10

我正在尝试设计 DT 中可用的展开行按钮的样式。样式可用here https://datatables.net/examples/api/row_details.html。我用于创建数据表的代码是-

library(DT)
datatable(
  cbind(' ' = '⊕', mtcars), escape = -2,
  options = list(
    columnDefs = list(
      list(visible = FALSE, targets = c(0, 2, 3)),
      list(orderable = FALSE, className = 'details-control', targets = 1)
    )
  ),
  callback = JS("
  table.column(1).nodes().to$().css({cursor: 'pointer'});
  var format = function(d) {
    return '<div style=\"background-color:#eee; padding: .5em;\"> Model: ' +
            d[0] + ', mpg: ' + d[2] + ', cyl: ' + d[3] + '</div>';
  };
  table.on('click', 'td.details-control', function() {
    var td = $(this), row = table.row(td.closest('tr'));
    if (row.child.isShown()) {
      row.child.hide();
      td.html('&oplus;');
    } else {
      row.child(format(row.data())).show();
      td.html('&CircleMinus;');
    }
  });"
))*

我不太熟悉 JS,所以我不知道从哪里开始。我尝试使用链接中的 JS 和 CSS 文件,但未能取得任何进展。任何线索表示赞赏,谢谢!


如果您在浏览器中打开表,则效果如下(这在 RStudio 查看器中不起作用)。但我怀疑有一个更简单的解决方案...而且这个解决方案依赖于 Github 上托管的图像,这不是很酷...

library(DT)
datatable(
  cbind(' ' = '<img src=\"https://raw.githubusercontent.com/DataTables/DataTables/master/examples/resources/details_open.png\"/>', 
        mtcars), escape = -2,
  options = list(
    columnDefs = list(
      list(visible = FALSE, targets = c(0, 2, 3)),
      list(orderable = FALSE, className = 'details-control', targets = 1)
    )
  ),
  callback = JS("
                table.column(1).nodes().to$().css({cursor: 'pointer'});
                var format = function(d) {
                return '<div style=\"background-color:#eee; padding: .5em;\"> Model: ' +
                d[0] + ', mpg: ' + d[2] + ', cyl: ' + d[3] + '</div>';
                };
                table.on('click', 'td.details-control', function() {
                var td = $(this), row = table.row(td.closest('tr'));
                if (row.child.isShown()) {
                row.child.hide();
                td.html('<img src=\"https://raw.githubusercontent.com/DataTables/DataTables/master/examples/resources/details_open.png\"/>');
                } else {
                row.child(format(row.data())).show();
                td.html('<img src=\"https://raw.githubusercontent.com/DataTables/DataTables/master/examples/resources/details_close.png\"/>');
                }
                });"
))
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

用闪亮的 R 设计 DT 中的展开行按钮 的相关文章

随机推荐

  • 按下按钮时如何更改 Twitter Bootstrap 选项卡?

    我需要在按下按钮时更改选项卡 并且选项卡应由 id 标识 以下代码对我不起作用 只是重新加载页面 div class form actions div
  • 从 Gmail 获取 pdf 附件作为文本

    我在网络和 Stack Overflow 上搜索但没有找到解决方案 我尝试做的事情如下 我通过邮件收到某些附件 我希望将其作为 纯 文本进行进一步处理 我的脚本如下所示 function MyFunction var threads Gma
  • 在java中将StreamWriter转换为OutputStream?

    我正在尝试使用 System setOut 将 System out 重定向到字符串 它需要一个 PrintStream 有什么方法可以将 StringWriter 转换为 Stream 以便我可以将其传递给 setOut 吗 你不能完全这
  • 通过服务删除 Windows 登录屏幕

    我正在尝试从服务启动的可执行文件中删除 Windows 登录屏幕 winlogon 该服务将随 Windows 自动启动 并等待来自另一台计算机的命令 当它收到命令时 它将启动一个 exe 该 exe 将在特定用户名下启动 cmd exe
  • WPF DataGridTemplateColumn 标题绑定不起作用

    我将 DataGrid 与一些手动创建的 DataGridTemplateColumns 一起使用 这是工作中的代码片段
  • 扩展 Django 1.11 用户模型

    我正在尝试弄清楚如何扩展 Django 用户模型以向用户添加信息 我似乎无法让它发挥作用 我究竟做错了什么 我可以在扩展的同一模型中使用外键吗 如何创建超级用户 还是必须通过手动创建python manage py shell 到目前为止
  • 尝试使用 Eclipse 启动 Glassfish 服务器时出现 org.apache.catalina.LifecycleException

    我一直忙于使用 angularjs 前端构建一个 REST 应用程序 使用 MAVEN jersey quickstart webapp 使用 GLASSFISH Web 服务器在 Eclipse 上开发 今天 当我开始对项目进行一些开发时
  • UEFI LoadImage 挂起

    我正在考虑使用 Bootservices 函数 LoadImage 从内存加载 UEFI 应用程序映像 函数参数为 typedef EFI STATUS LoadImage IN BOOLEAN BootPolicy IN EFI HAND
  • 如果文件类型 == tex

    如果文件是乳胶文件 我想在 vimrc 中运行命令 我想我的语法有问题 但它不起作用 有什么线索吗 if filetype tex set spell endif 您可以使用自动命令来实现您想要的 autocmd BufNewFile Bu
  • 如何清除ember js中的表单数据

    嗨 我对 ember js 很陌生 我写了一个新员工入职表格 并通过路线发送数据 数据保存成功 但问题是提交表单后我的表单数据没有清除 代码如下 app js App Router map function this resource sa
  • Azure Web 部署“发布失败”

    各位开发人员大家好 我目前正在努力解决最新的 Visual Studio 2017 Professional 版本 15 8 1 中的问题 自从更新到版本 15 8 以来 我无法通过 Web 部署发布任何 Azure Functions 每
  • 如何在 Logstash 中将一个事件的字段引用到另一个事件?

    我目前正在处理日志 其中一些内容如下所示 00 19 59 771 07120 evtThread TRC gt Cem lt Core1 CALL STATE 00 20 00 199 05768 BCMApplicationThread
  • 如何将FireMonkey表单无缝嵌入VCL表单中?

    我使用了中描述的技巧这个问题 https stackoverflow com questions 7315050 delphi xe2 possible to instantiate a firemonkey form in vcl app
  • 如何使用 Serilog ForContext

    我是 Serilog 新手 很难弄清楚如何使用上下文功能 当我运行下面的代码时 输 出文件不包含报告 ID 我缺少什么想法吗 var logger new LoggerConfiguration WriteTo File C Log txt
  • 如何在 C# 中为时间添加秒? [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 如何将秒添加到时间中小时 分 秒在c 中格式化 示例 我想将秒数5678添加到小时 分 秒然后显示结果 您可以使用添加秒数 http ms
  • 如何以编程方式在 vs 2008 中创建新的空白解决方案?

    基于设计的方法是 新建项目 gt 其他项目类型 gt Visual Studio 解决方案 gt 空白解决方案 我必须在 C 中以编程方式创建一个空白解决方案 并在此解决方案中添加新的空项目和文件 我在网上找到了很多使用 DTE 的代码 但
  • Android P Beta - AlarmManager 通知不起作用

    我正在 Android P beta 版本 4 上测试我的应用程序 我的应用程序目标SdkVersion是27 据观察 警报管理器通知未按预期工作 我使用下面的代码来设置通知 if android os Build VERSION SDK
  • Javascript - 模板字符串不能漂亮地打印对象

    我可以使用 ES6 模板字符串来漂亮地打印 javascript 对象吗 这是来自 React Native 项目 其中console log 输出到 Chrome 调试工具 我想要的是 const description App open
  • python 中未定义变量

    你好 我对 python 编程很陌生 我正在开始我的第一个程序 但我遇到了一些麻烦 有没有更好的方法来执行下面的代码片段 当我运行该程序时 我得到 yes no 未定义 def main print n Welcome to registr
  • 用闪亮的 R 设计 DT 中的展开行按钮

    我正在尝试设计 DT 中可用的展开行按钮的样式 样式可用here https datatables net examples api row details html 我用于创建数据表的代码是 library DT datatable cb