Question

我的输出字符串是一个完整的网址，我希望以不同的颜色突出显示该网址中的不同参数。我尝试了几种不同的方法在服务器中拆分字符串。然后尝试在ui.R中加入它们并应用不同的CSS类但没有成功......链接看起来像这样

http://www.example.com?utm_campaign= [蓝色文字] ＆amp; utm_source = [红色文字]

当我尝试组合从server.R传递的URL的不同部分时，它会在最终的URL中创建空格。

以下是一些示例代码

在server.R

中

output$val1 <-  renderText({"http://www.example.com?utm_campaign="})
output$val2 <-  renderText({"[Enter campaign name]"})

在ui.R

p(textOutput("val1"), span(textOutput("val2"), style = "color:blue"), "more text" )

这会将输出分为两行

Answer 1

您提供的示例代码会创建换行符，而不仅仅是空格。如果这是您要解决的问题，那么这里就是解决方案：将inline = TRUE作为参数添加到textOutput。或者，如果您使用的是不支持该版本的旧版闪亮版，请使用CSS添加display: inline;。

p(textOutput("val1", inline = TRUE), span(textOutput("val2", inline = TRUE), style = "color:blue"), "more text" )

我通常会看一下闪亮的应用程序的HTML输出，看看是怎么回事来弄清楚事情的呈现方式，这就是我的方式。

您会注意到连续的<span>元素之间仍然存在差距。如果这是你之前提到的，那么这是一个更复杂的问题，即使在纯HTML / CSS中也没有一个漂亮的解决方案，更不用说Shiny了。例如，请参阅this thread。

这是克服这一点的一种可能方法，我承认这不是很漂亮。可能有其他方法可以实现这一点，但这是我能想到的第一个解决方案，借用CSS问题线程中的想法。主要思想是在父节点上使用font-size:0并恢复跨度的原始字体大小。

tags$head(
  tags$style(HTML("
    #val2 {
      color: blue;
    }
    p {
      font-size: 0;
    }
    p > * {
      font-size: 14px;
    } 
  "))
),

p(textOutput("val1", inline = TRUE), textOutput("val2", inline = TRUE), span("more text"))

希望这有帮助

在r闪亮的ui中突出显示不同颜色的字符串的不同部分

1 个答案: