0

I have following side bar panel in R shiny dashboard

dashboardSidebar(
tags$style(".fa-ship {color:#5DADE2}"),
tags$style(".fa-shopping-cart {color:#5DADE2}"),
tags$style(".fa-dollar {color:#5DADE2}"),
tags$style(".fa-keyboard-o {color:#5DADE2}"),
tags$style(".fa-line-chart {color:#5DADE2}"),

sidebarMenu(
  menuItem("Vessel Line-Up Coal Quantity", tabName = "coal_quantity",
           icon = icon("ship", lib="font-awesome")),

  menuItem("Coal Stocks at Port", tabName = "coal_stocks",
           icon = icon("fa fa-shopping-cart", lib="font-awesome")),

  menuItem("Coal Price", tabName = "coal_quan_price",
           icon = icon("dollar", lib="font-awesome")),

  menuItem("Forecasting Weeks", tabName = "man_input",
           icon = icon("keyboard-o", lib="font-awesome"),
           numericInput("forecast_days", "Week ahead forecast:",5, min = 1, max = 500)
  ),

  menuItem("Coal Price Forecasting", tabName = "coal_forecasting",
           icon = icon("line-chart", class = "fa-spin",lib="font-awesome"))

)
),

I want to add text scrolling effect for Coal Price forecasting text in sidebar. How can I add it?

3
  • What do you mean by text scrolling?
    – Pork Chop
    Jul 27, 2018 at 7:15
  • From left to right
    – Neil
    Jul 27, 2018 at 7:16
  • Like we get it from <marquee behavior="scroll" direction="right">Your slide-in text goes here</marquee>
    – Neil
    Jul 27, 2018 at 7:17

1 Answer 1

1

Is this what you want?

rm(list = ls())
library(shiny)
library(shinydashboard)

ui <- fluidPage(
  dashboardPage(
    dashboardHeader(title = "Text Scrolling"),
    dashboardSidebar(
      tags$style(".fa-ship {color:#5DADE2}"),
      tags$style(".fa-shopping-cart {color:#5DADE2}"),
      tags$style(".fa-dollar {color:#5DADE2}"),
      tags$style(".fa-keyboard-o {color:#5DADE2}"),
      tags$style(".fa-line-chart {color:#5DADE2}"),

      sidebarMenu(
        menuItem("Vessel Line-Up Coal Quantity", tabName = "coal_quantity",
                 icon = icon("ship", lib="font-awesome")),

        menuItem("Coal Stocks at Port", tabName = "coal_stocks",
                 icon = icon("fa fa-shopping-cart", lib="font-awesome")),

        menuItem("Coal Price", tabName = "coal_quan_price",
                 icon = icon("dollar", lib="font-awesome")),

        menuItem("Forecasting Weeks", tabName = "man_input",
                 icon = icon("keyboard-o", lib="font-awesome"),
                 numericInput("forecast_days", "Week ahead forecast:",5, min = 1, max = 500)
        ),
        menuItem(
          HTML('<marquee behavior="scroll" direction="left">Coal Price Forecasting</marquee>'),
          "Coal Price Forecasting", tabName = "coal_forecasting",
                 icon = icon("line-chart", class = "fa-spin",lib="font-awesome"))
      )
    ),
    dashboardBody()
  )
)

server <- function(input, output, session){}

shinyApp(ui, server)

enter image description here

3
  • Yes. Thanks alot. Worked like a charm :) How can I change the color of same text?
    – Neil
    Jul 27, 2018 at 7:24
  • You can change the background color like so:tagindex.net/html/text/marquee_example.html and the text like so:<font color="red"><marquee behavior="scroll" direction="left"> Coal Price Forecasting</marquee>' but it shifts the little arrow
    – Pork Chop
    Jul 27, 2018 at 7:32
  • Yeah. It shifts the arrow little bit down.
    – Neil
    Jul 27, 2018 at 7:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.