正文 

当前位置： 首页 > 知识 >

如何使用shinyjs从服务器更改shinydashboard中的标题颜色

     2023-03-24     267

关键词：

【中文标题】如何使用shinyjs从服务器更改shinydashboard中的标题颜色【英文标题】：How to change the title color in shinydashboard from server using shinyjs 【发布时间】：2021-11-19 18:16:47 【问题描述】：

我想从服务器部分更改闪亮仪表板中标题的标题。简单的文本，例如p()，可以改，而标题好像没变。

library(shinydashboard)
library(shiny)

header <- dashboardHeader(title='want to be red') |> 
        tagAppendAttributes(id='nn',.cssSelector = 'span')

side <- dashboardSidebar(
    useShinyjs(),
    inlineCSS(list('.red' = "color: red")),
    p(id = "p", "to red color")
)

body <- dashboardBody()

ui <- dashboardPage(header,side,body,title = 'nhanesR')

server <- function(input, output, session)
    toggleClass(id = 'nn', "red")
    toggleClass(id = 'p', "red")

shinyApp(ui,server)

【问题讨论】：

【参考方案1】：
    你忘了图书馆shinyjs 最好将 shinyjs useShinyjs() 加载到正文中。 对于标题，不能简单地添加红色类。原始样式表有一个更强大的选择器，可以防止您更改颜色。我们需要使用内联样式，它具有几乎最高优先级来覆盖颜色。 
library(shinydashboard)
library(shiny)
library(shinyjs)
header <- dashboardHeader(title='want to be red') |> 
    tagAppendAttributes(id='nn',.cssSelector = 'span')

side <- dashboardSidebar(
    inlineCSS(list('.red' = "color: red")),
    p(id = "p", "to red color")
)

body <- dashboardBody(
    useShinyjs()
)

ui <- dashboardPage(header,side,body,title = 'nhanesR')

server <- function(input, output, session)
    runjs('$("#nn").css("color", "red")')
    toggleClass(id = 'p', "red")

shinyApp(ui,server)

除非您想动态更改它，否则不确定为什么要使用 shinyjs 来执行此操作。我们可以在 UI 上使用 tags$style 完成所有这些操作。

【讨论】：

非常感谢您的回答，它不适用于我的电脑，我将所有软件包更新到最新版本。我的 R 版本是 4.1.0。 感谢您让我知道。他们更新了shinydashboard。现在他们稍微改变了选择器。我编辑了答案，再试一次。 非常感谢。 id 选择器在这里似乎不起作用。类 seleftor .logo 作品

用shinyjs改变shinydashboard框的样式

...表板框的颜色。为此，我从tabsetPanel获取输入值，并尝试使用shinyjs更改box-header类的css。不幸的是，我的试验都没有成功。这是一个可重现的示例（颜色尚未适应 查看详情

使用 ShinyJS 初始化隐藏元素

】使用ShinyJS初始化隐藏元素【英文标题】：InitalisinghiddenelementswithShinyJS【发布时间】：2020-02-1218:25:17【问题描述】：我想在闪亮的应用程序启动时隐藏一个元素，但与thisexample不同的是，要隐藏的元素是可见的较大元素的一部分... 查看详情

启用/禁用不使用 flexdashboard+shinyjs

】启用/禁用不使用flexdashboard+shinyjs【英文标题】：Enable/disablenotworkingwithflexdashboard+shinyjs【发布时间】：2020-01-2404:00:57【问题描述】：我知道thisissue并且它显然已经解决了，但我仔细检查了我是否有相关软件包的最新版本，disable... 查看详情

如何从 SQL Express 2012 获取数据更改通知？

...布时间】：2016-05-3114:13:41【问题描述】：我们有客户端-服务器应用程序，其中客户端内置在DelphiXE4中，服务器使用SQLServer2012Express版本。我的delphi应用程序（使用WMI处理服务器事件）可以接收来自Express版的数 查看详情

使用shinydashboard和shinyjs在tabBox中启动时隐藏tabPanel

】使用shinydashboard和shinyjs在tabBox中启动时隐藏tabPanel【英文标题】：HiddentabPanelonstartupwithintabBoxusingshinydashboard&shinyjs【发布时间】：2021-06-1901:04:33【问题描述】：首先让我给你一些与我的问题相关的背景。我正在使用shiny、shiny... 查看详情

如何从服务器 asp.net 更改 css

】如何从服务器asp.net更改css【英文标题】：HowdoIchangecssfromserverasp.net【发布时间】：2021-08-2202:04:22【问题描述】：我想通过服务器更改我的css值以取决于服务器的响应。我尝试使用内联表达式，但没有成功。@keyframesloading-10%-webki... 查看详情

使用 shinyjs 和 flexdashbord 动态显示/隐藏输入

】使用shinyjs和flexdashbord动态显示/隐藏输入【英文标题】：Dynamicallyshow/hideinputwithshinyjsandflexdashbord【发布时间】：2017-05-1823:25:18【问题描述】：点击标签时尝试更新flexdashboard中的侧边栏。无法让它工作。---title:"TestSidebar"output:flex... 查看详情

shinyjs 不会隐藏使用 renderUI 创建的按钮

】shinyjs不会隐藏使用renderUI创建的按钮【英文标题】：shinyjswon\'thidebuttoncreatedwithrenderUI【发布时间】：2021-06-2616:14:02【问题描述】：我有一个使用shinyproxy制作的闪亮应用程序。在server.R上，我使用renderUI创建了一些UI元素，如下... 查看详情

使用 shinyjs 切换表单水平输入及其标签

】使用shinyjs切换表单水平输入及其标签【英文标题】：Togglingaform-horizontalinputanditslabelusingshinyjs【发布时间】：2019-11-0720:56:36【问题描述】：下面的应用程序有两个selectInputs（month_abbr和month_full）和一个checkboxInput（abbr）。我想在... 查看详情

如何使用闪亮的js单击一个阴谋模式栏按钮？(代码片段)

我已经知道我需要使用shinyjs和extendShinyjs，所以这就是我到目前为止所拥有的：在ui.Rui函数之外：js_reset_axes<-"shinyjs.reset_axes=function()"在ui函数内：extendShinyjs(text=js_reset_axes,functions=c("reset_axes"))并在服务器功能：js$reset_axes() 查看详情

使用 shinyjs 使用 javascript 在闪亮的应用程序中操作现有的传单地图

】使用shinyjs使用javascript在闪亮的应用程序中操作现有的传单地图【英文标题】：ManipulateexistingLeafletmapinashinyappwithjavascriptusingshinyjs【发布时间】：2018-10-0712:47:30【问题描述】：我有一个闪亮的应用程序，其中包含现有的传单地... 查看详情

iPhone/Sqlite - 如何仅从服务器获取更改的数据？

】iPhone/Sqlite-如何仅从服务器获取更改的数据？【英文标题】：iPhone/Sqlite-howtogetonlychangeddatafromserver?【发布时间】：2010-01-1509:33:31【问题描述】：我正在服务器上生成一个相当大的sqlite文件（大约30\'000个条目，大约3mb大）并且想... 查看详情

iOS 应用程序 - 如何从外部源更改启动图像？

...夹中获取启动图像。我想知道如何将起始图像更改为来自服务器的图像。【问题讨论】：【参考方案1】：不可能使用从外部来源提供的启动图像。您应该将每个 查看详情

如何从 TFS 获取 VS Code 中其他用户的更改

...制（请注意，我们的代码在公司防火墙内，在本地TFS构建服务器上，而不是在Gits存储库上） 查看详情

使用javascript使用shinyjs将数据表导出为shiny中的csv

...部，包括所有下拉菜单选项，或输出HTML）。我正在尝试使用Javascript导出我拥有的数据。为此，我使用以下基于以下downloadcsv.js创建的外部Javascript函数guide：shinyjs.myfunction=function(ar 查看详情

选择器输入作为过滤器使用shinyJS禁用所有未禁用按钮

】选择器输入作为过滤器使用shinyJS禁用所有未禁用按钮【英文标题】：pickerinputasfilterdisableallnotdisablingbuttonusingshinyJS【发布时间】：2021-08-2813:38:28【问题描述】：希望你保持安全。我已经搜索过类似的问题，但没有成功。我的代... 查看详情

如何使用 PHP 邮件从地址更改信封？

】如何使用PHP邮件从地址更改信封？【英文标题】：HowtochangeenvelopefromaddressusingPHPmail?【发布时间】：2010-09-1519:02:59【问题描述】：我在Linux上使用PHP和Apache，以及Sendmail。我使用PHPmail函数。电子邮件已发送，但信封在MAILFROM中有A... 查看详情

如何在服务器上提交更改并从代码存储库中提取更新而不会发生冲突？

】如何在服务器上提交更改并从代码存储库中提取更新而不会发生冲突？【英文标题】：Howtocommitchangesonserverandpullupdatesfromcoderepositorywithoutconflict?【发布时间】：2021-03-2718:19:55【问题描述】：我从我的GitLab存储库中推送了最新代... 查看详情