本文介绍了如何为滑杆(sliderInput)上色?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我尝试为R发光中的几个silderInput条制作不同的颜色。它需要css等。我在网上查看,只能找到如何制作一个 silderInput
的方法。如何为不同的条创建几种不同的颜色?
I tried to make different color for a few silderInput bar in R shiny. It requires css etc.I looked online and can only find how to make one silderInput
. How can I make create several different color to different bars?
这是我的测试代码。它将以相同的样式显示所有条形:
Here are my testing code. It will show all bar in same style:
ui <- fluidPage(
tags$style(type = "text/css", "
.irs-bar {width: 100%; height: 25px; background: black; border-top: 1px solid black; border-bottom: 1px solid black;}
.irs-bar-edge {background: black; border: 1px solid black; height: 25px; border-radius: 0px; width: 20px;}
.irs-line {border: 1px solid black; height: 25px; border-radius: 0px;}
.irs-grid-text {font-family: 'arial'; color: white; bottom: 17px; z-index: 1;}
.irs-grid-pol {display: none;}
.irs-max {font-family: 'arial'; color: black;}
.irs-min {font-family: 'arial'; color: black;}
.irs-single {color:black; background:#6666ff;}
.irs-slider {width: 30px; height: 30px; top: 22px;}
.irs-bar1 {width: 50%; height: 25px; background: red; border-top: 1px solid black; border-bottom: 1px solid black;}
.irs-bar-edge1 {background: black; border: 1px solid red; height: 25px; border-radius: 0px; width: 20px;}
.irs-line1 {border: 1px solid red; height: 25px; border-radius: 0px;}
.irs-grid-text1 {font-family: 'arial'; color: white; bottom: 17px; z-index: 1;}
.irs-grid-pol1 {display: none;}
.irs-max1 {font-family: 'arial'; color: red;}
.irs-min1 {font-family: 'arial'; color: red;}
.irs-single1 {color:black; background:#6666ff;}
.irs-slider1 {width: 30px; height: 30px; top: 22px;}
"),
uiOutput("testSlider")
)
server <- function(input, output, session){
output$testSlider <- renderUI({
fluidRow(
column(width=3,
box(
title = "Preferences", width = NULL, status = "primary",
sliderInput(inputId="test", label=NULL, min=1, max=10, value=5, step = 1, width='100%'),
sliderInput(inputId="test2", label=NULL, min=1, max=10, value=5, step = 1, width='50%')
)
))
})
}
shinyApp(ui = ui, server=server)
推荐答案
下面是示例代码,说明了如何修改滑块的样式
。
Below is a sample code of how you can modify style
of the sliders. You can add your own logic to it.
rm(list = ls())
library(shiny)
ui <- fluidPage(
# All your styles will go here
tags$style(HTML(".js-irs-0 .irs-single, .js-irs-0 .irs-bar-edge, .js-irs-0 .irs-bar {background: purple}")),
tags$style(HTML(".js-irs-1 .irs-single, .js-irs-1 .irs-bar-edge, .js-irs-1 .irs-bar {background: red}")),
tags$style(HTML(".js-irs-2 .irs-single, .js-irs-2 .irs-bar-edge, .js-irs-2 .irs-bar {background: green}")),
sliderInput("slider1", "Slider 1",min = 0.1, max = 1, value = 0.4, step = 0.05),
sliderInput("slider2", "Slider 2",min = 0.1, max = 1, value = 0.4, step = 0.05),
sliderInput("slider3", "Slider 3",min = 100, max = 20000, value = 5000, step= 200)
)
server <- function(input, output, session){}
shinyApp(ui = ui, server=server)
这篇关于如何为滑杆(sliderInput)上色?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!