IRscope是用来可视化叶绿体基因组边界收缩扩张的一个shiny应用。最想学习的是其中鉴定反向重复区的代码和画图用到的代码。
但是这两个函数实在是太长了,看起来还有些吃力。
今天记录一下ui相关的代码
他的ui代码主要用到的就是tabPanel,里面没有太复杂的知识点。
以下是自己手动敲的代码
代码语言:javascript复制library(shiny)
ui <- fluidPage(
tags$br(),
HTML('<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1 {color:#267A43}
</style>
</head>
<body>
<div>
<h1>IRScope</h1>
</div>
</body>
</html>'),
tags$br(),
fluidRow(column(width = 1,""),
column(width=11,offset = 1,tabsetPanel(
tabPanel(strong("Home"),br(),
column(width = 6,h4(tags$em("Welcome to IRscope...")),
br(),p(tags$strong("IRscope"),"is a tool for "))),
tabPanel("Files upload",br(),
fluidRow(column(width=11,br(),p("You need .."))),
br(),br(),br(),
tabsetPanel(tabPanel("GB file",br(),br(),p("In this section you can")),
fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
column(width=1,br())),
fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
column(width=1,br())),
fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
column(width=1,br())),
fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
column(width=1,br())),
column(width=10,verbatimTextOutput("stat"),actionButton("Gbsub",label = "Submit"),
br(),br(),p("After submission the section below will turn innactive")),
downloadButton("downloadData",label="Download"))),
tabPanel("Manual Files",br(),p("In case your GB files are of low quality or otherwise"),
fluidRow(br(),
column(width=3,fileInput(inputId="dogma1",label = "Annotations",placeholder = "And Fasta file")),
column(width = 6,textInput(inputId = "IR1",label = "IR info (optional)",placeholder = "IR end, IRb start, IRa end")),
column(width = 2,br())),
fluidRow(column(width=3,fileInput(inputId = "fas1",label = "Genome Fasta",placeholder = "And Fasta file"))),
column(width = 10,actionButton("Go","Submit"),br(),br(),p("After submission"))),
tabPanel("FAQ",br(),column(width=1,""),br(),
column(width = 6,h4(strong("Q:"),tags$em(strong("Why the gene names are not displayed properly?"))),
p(strong("A:"),"Check your input file(s)"),br(),
h4(strong("Q:")))),
tabPanel("About",br(),column(width=6,p("IRscope and its all dependencies"))),
tabPanel("Contact",br(),column(width = 6,p("The paper describing this")))
)))
)
server <- function(input,output){
}
shinyApp(ui,server)
最终的效果就是这个样子
image.png
基本上看懂了代码结构,他的源代码最多支持10个画图,如果有需求画大于10个的话自己应该可以改他的代码满足需求。