I'm using pageWithSidebar with a sidebar on the left. Now I'd like to add button on the top right side of the page. How could I achieve this?
http://shiny.rstudio.com/reference/shiny/latest/pageWithSidebar.html
I found dashboard but the structure doesn't look the sames as regular shiny. https://rstudio.github.io/shinydashboard/structure.html
navbarPage(
title = 'DataTable Options',
tabPanel('Display length', DT::dataTableOutput('ex1')),
tabPanel('Length menu', DT::dataTableOutput('ex2')),
tabPanel('No pagination', DT::dataTableOutput('ex3')),
tabPanel('No filtering', DT::dataTableOutput('ex4')),
tabPanel('Function callback', DT::dataTableOutput('ex5'))
)pageWithSidebar(
headerPanel("test"),
sidebarPanel(
textInput("globalSearch", "Search", "")))
Related
The following code can be used to show how I would want a tooltip to appear. If version=3 then the function in shinyBS works and produces the tooltip. However with version=4 it does not work. I don't want to use the shinyBS package as it seems it's still in dev mode and would rather just straight prefer to wrap my button with some HTML using tooltips from bootstrap directly as shown here.
I'm not having success in doing it this way and wonder if anyone can suggest a good way to get the tool top for my button just using the pure HTML?
library(shiny)
library(bslib)
library(shinyBS)
ui <- fluidPage(
navbarPage(
theme = bs_theme(bootswatch = "flatly", version = 4),
title = 'Methods',
tabPanel('One'),
),
mainPanel(
h1('Hello World'),
actionButton("button", "Some Button"),
bsTooltip("button", "Something to be said here", "top"),
)
)
server <- function(input, output) {
}
shinyApp(ui, server)
As shown in the below image, I have a problem with a ghost tab that appears at the end of my navbar page.
The ghost tab disappears when the code below at the end of ui is deleted. The code is related to the loading sign. How can I fix this?
hidden(
div(
id = "app-content"
#p("")
)
)
I fixed this by moving the mentioned code to right after ui <- fluidPage(.
ui <- fluidPage(
hidden(
div(
id = "app-content"
#p("")
)
),
I'm Building a dashboard using the packages shiny and shinydashboard, The issue I am having is when I try to include a math symbol inline with text when the app is launched it always smaller than its surrounding text. When the app is launched and right click on a math symbol and navigate to
Math Setting>Math Render> the switch from HTML-CSS to HTML Preview it becomes the correct size. Wondering why this is the case and how I can make appear as the correct size by default so I don't have users switch HTML preview when they launch the app.
I tried adding the follow to change my Mathjax configuration upon the apps launch but it didn't seem to have any effect:
tags$div(HTML("<script type='text/x-mathjax-config' >
MathJax.Hub.Config({
showProcessingMessages: true,
jax: ['input/TeX', 'output/PreviewHTML'],
});
</script >
"))
Here is a basic version of what I'm dealing with when ran the Mu symbol is much smaller than the other text.
header <- dashboardHeader(
#Set the title and title size of the dashboard. This will be located in top left coner of app.
title = "My Dashboard",
titleWidth = 400
)
# Sidebar Layout
# Contains the design for collapsable sidebar of the dashboard which allows users to navigate to its differnt pages.
sidebar <- dashboardSidebar(
sidebarMenu(
# Each item navigates the dashboard to its corresponding page
menuItem("Inputs", tabName = "inputs",icon = icon("angle-right"))
)
)
#Boday Layout
# Contains the design for each indivual page listed within the side bar
body <- dashboardBody(
withMathJax(),
tags$div(HTML("<script type='text/x-mathjax-config' >
MathJax.Hub.Config({
showProcessingMessages: true,
jax: ['input/TeX', 'output/PreviewHTML'],
});
</script >
")),
dashboardBody(
# TabItemS refrences theset of dashboard pages as whole
tabItems(
# First Pages contents
tabItem(
tabName = "inputs",
h1("Here is the Problem"),
fluidRow(
box(width = 4,
h3("This symobl \\(\\mu\\) is much smaller")
)
)
)
)
)
)
ui <- dashboardPage(header,sidebar,body)
server <- function(input, output) {
}
shinyApp(ui, server)
is there any way to show all of the contents in the mainPanel only when the user clicks the action button? ive been searching the internet for awhile for the answer but couldn't really find an answer. i know i can use hidden - it works on smaller elements inside the mainPanel, such as showing a picture on click but doesn't work on the whole mainPanel itself. any suggestions? finding a way to wrap the whole main panel inside a hidden instead of each element in the mainPanel wrapped in a hidden would be easier i think but i can't seem to find a way to make it work.
in dashboard body:
fluidRow(
column(12, actionButton("analyze", "Fetch Data!", width = "100px"))),
hidden(
mainPanel(
hidden( (htmlOutput("artistpic")), // this works fine & shows on button click
infoBoxOutput("approvalBox"))
)),
server:
pic <- eventReactive(input$analyze2, {
print(get_id_picture()[3])
url = toString(get_id_picture()[3])
print(url)
url
})
output$artistpic <- renderText({c('<img src="',pic(),'"width="17%" height="17%">')})
This is easy with shinyjs.
Just surround mainPanel() with a div() tag so that you can use it's id for toggling it's visability and start the app with the div tag hidden using hidden() like in the following example:
# ui.R
fluidPage(
useShinyjs(),
actionButton("toggle.main.button", "Toggle Main"),
div(id = "main",
mainPanel(
p("This paragraph is in main."),
p("This one too!")
)
) %>% shinyjs::hidden()
)
# server.R
library(shinyjs)
function(input, output, session) {
# Toggling visability of main on button click.
observeEvent(input$toggle.main.button, {
shinyjs::toggle("main")
})
}
I'm trying to add a tabPanel in navbarPage so that when you click on it opens a modal window instead of a new tab. The snippet below is not valid because tabPanel does not have an id parameter.
library(shiny)
library(shinyBS)
shinyUI(fluidPage(
navbarPage("Sample App", id = "main_menu",
tabPanel("Open Modal", id = "moda")),
bsModal("modal1", "Example", "moda", p("This is a modal"))
)
If I edit the generated HTML code from browser, I can make this possible by changing the line
Open Modal
with
Open Modal
on the <li> element.
Any idea how to do this or at least how can I override the generated html from shiny?
One solution is to use Javascript to rewrite the attribute for the tab title. The JS code below finds the tab title link, and rewrites its attributes.
library(shiny)
jsStr <- '$(document).ready(function(){
$("a[data-value=\'OpenModal\']").attr({
"href":"#",
"data-toggle":"modal",
"data-target":"#modal1"
});
})
'
ui <- shinyUI(fluidPage(
tags$head(tags$script(HTML(jsStr))),
navbarPage("title",
tabPanel("OpenModal")
),
bsModal("modal1", "Example", "moda", p("This is a modal"))
))