简体   繁体   中英

R : How to display value by pointing on line graph in Shiny web app?

I'm practicing using Shiny to create a web app. My question is How to make the line graph shows value by cursor pointing?

Multiple files shiny app :

data.R

df <- read.table(text="
                              DateTime,Val1,Val2
                 1  ,2017-07-01 09:32:00      ,401.7542   ,275.5876
                 2  ,2017-07-01 09:30:00      ,402.7049   ,359.2615
                 3  ,2017-07-01 09:29:00      ,402.5912   ,276.4372
                 4  ,2017-07-01 09:28:00      ,402.7526   ,362.6202
                 5  ,2017-07-01 09:27:00      ,402.4538   ,361.3867
                 6  ,2017-07-01 09:26:00      ,401.8847   ,359.6318
                 7  ,2017-07-01 09:25:00      ,402.2666   ,274.8941
                 8  ,2017-07-01 09:24:00      ,403.0774   ,277.4844
                 9  ,2017-07-01 09:23:00      ,403.0516   ,363.3593
                 10 ,2017-07-01 09:22:00      ,402.5764   ,275.4202
                 11 ,2017-07-01 09:21:00      ,402.2379   ,275.0550
                 12 ,2017-07-01 09:20:00      ,401.9060   ,277.2950
                 13 ,2017-07-01 09:19:00      ,401.9451   ,361.0770
                 14 ,2017-07-01 09:18:00      ,401.4484   ,361.3591
                 15 ,2017-07-01 09:17:00      ,402.5519   ,274.8206
                 16 ,2017-07-01 09:16:00      ,402.1426   ,279.2438
                 17 ,2017-07-01 09:15:00      ,402.4618   ,360.7491
                 18 ,2017-07-01 09:14:00      ,403.3124   ,276.4756
                 19 ,2017-07-01 09:13:00      ,402.3604   ,276.7015
                 20 ,2017-07-01 09:12:00      ,402.5518   ,363.2422
                 21 ,2017-07-01 09:11:00      ,404.7830   ,360.2075
                 22 ,2017-07-01 09:10:00      ,403.7317   ,275.8560
                 23 ,2017-07-01 09:09:00      ,403.2151   ,276.8633
                 24 ,2017-07-01 09:08:00      ,404.2897   ,361.6937
                 25 ,2017-07-01 09:07:00      ,403.8227   ,355.2353
                 26 ,2017-07-01 09:06:00      ,402.8998   ,276.0700
                 27 ,2017-07-01 09:05:00      ,403.1328   ,362.2495
                 28 ,2017-07-01 09:04:00      ,404.1612   ,361.9048
                 29 ,2017-07-01 09:03:00      ,403.7537   ,274.9531
                 30 ,2017-07-01 09:02:00      ,402.1621   ,360.7682
                 31 ,2017-07-01 09:01:00      ,403.0805   ,360.8172
                 32 ,2017-07-01 09:00:00      ,403.3630   ,276.2874
                 33 ,2017-07-01 08:59:00      ,402.8351   ,275.9734
                 34 ,2017-07-01 08:58:00      ,403.6484   ,360.5585
                 35 ,2017-07-01 08:57:00      ,403.4342   ,357.7776
                 36 ,2017-07-01 08:56:00      ,402.4444   ,275.8763
                 37 ,2017-07-01 08:55:00      ,403.2913   ,361.2458
                 38 ,2017-07-01 08:54:00      ,403.2985   ,276.7728
                 39 ,2017-07-01 08:53:00      ,403.2600   ,276.6644
                 40 ,2017-07-01 08:52:00      ,401.9991   ,361.2737
                 41 ,2017-07-01 08:51:00      ,404.9158   ,358.2727
                 42 ,2017-07-01 08:50:00      ,403.8922   ,357.0592
                 43 ,2017-07-01 08:49:00      ,403.0070   ,359.5312
                 44 ,2017-07-01 08:48:00      ,404.8530   ,360.1790
                 45 ,2017-07-01 08:47:00      ,404.1543   ,359.4836
                 46 ,2017-07-01 08:46:00      ,403.9200   ,357.9064
                 47 ,2017-07-01 08:45:00      ,403.9197   ,358.6364
                 48 ,2017-07-01 08:44:00      ,406.0925   ,358.6248
                 49 ,2017-07-01 08:43:00      ,401.5529   ,359.9990
                 50 ,2017-07-01 08:42:00      ,402.4422   ,356.6060",sep=",",header=TRUE,stringsAsFactors=FALSE)
df$DateTime <- as.POSIXct(df$DateTime)

ui.R

source('~/R/work/reactonplot/data.R')
library(shiny)


shinyUI(fluidPage(

  titlePanel("Practice Reaction on Plot"),

       plotOutput("myPlot")

))

server.R

library(shiny)
library(ggplot2)

shinyServer(function(input, output) {

  output$myPlot <- renderPlot({

    ggplot(df, aes(DateTime)) + ylab("Val") +
      geom_line(aes(y = Val1, colour = "Val1"),lwd=0.7) + 
      geom_line(aes(y = Val2, colour = "Val2"),lwd=0.8) + 
      expand_limits( y = 0) +
      scale_x_datetime(expand = c(0,0)) +
      theme(text = element_text(size=10),
            legend.text = element_text(size=10),
            panel.background = element_rect(fill = "white", colour = "black"))

  })
})

Here is what my expected output :

在此处输入图片说明

So, how to get this reaction on my plot? Any ideas please help. Thank you so much sir.

EDITED : I found the answer by using ggplotly

in server.ui change renderPlot to renderPlotly and add hiding option bar

output$myPlot <- renderPlotly({

    p <- ggplot(df, aes(DateTime)) + ylab("Val") +
      geom_line(aes(y = Val1, colour = "Val1"),lwd=0.7) + 
      geom_line(aes(y = Val2, colour = "Val2"),lwd=0.8) + 
      expand_limits( y = 0) +
      scale_x_datetime(expand = c(0,0)) +
      theme(text = element_text(size=10),
            legend.text = element_text(size=10),
            panel.background = element_rect(fill = "white", colour = "black"))

    ggplotly(p) %>% config(displayModeBar = FALSE)

  })

in ui.R change plotOutput to plotlyOutput

Maybe you can load the data in you server.r not in your ui.r. I just read the data in server.r and can show the result you want. I run it in a single file:

df <- read.table(text="DateTime,Val1,Val2
                 1  ,2017-07-01 09:32:00      ,401.7542   ,275.5876
                 2  ,2017-07-01 09:30:00      ,402.7049   ,359.2615
                 3  ,2017-07-01 09:29:00      ,402.5912   ,276.4372
                 4  ,2017-07-01 09:28:00      ,402.7526   ,362.6202
                 5  ,2017-07-01 09:27:00      ,402.4538   ,361.3867
                 6  ,2017-07-01 09:26:00      ,401.8847   ,359.6318
                 7  ,2017-07-01 09:25:00      ,402.2666   ,274.8941
                 8  ,2017-07-01 09:24:00      ,403.0774   ,277.4844
                 9  ,2017-07-01 09:23:00      ,403.0516   ,363.3593
                 10 ,2017-07-01 09:22:00      ,402.5764   ,275.4202
                 11 ,2017-07-01 09:21:00      ,402.2379   ,275.0550
                 12 ,2017-07-01 09:20:00      ,401.9060   ,277.2950
                 13 ,2017-07-01 09:19:00      ,401.9451   ,361.0770
                 14 ,2017-07-01 09:18:00      ,401.4484   ,361.3591
                 15 ,2017-07-01 09:17:00      ,402.5519   ,274.8206
                 16 ,2017-07-01 09:16:00      ,402.1426   ,279.2438
                 17 ,2017-07-01 09:15:00      ,402.4618   ,360.7491
                 18 ,2017-07-01 09:14:00      ,403.3124   ,276.4756
                 19 ,2017-07-01 09:13:00      ,402.3604   ,276.7015
                 20 ,2017-07-01 09:12:00      ,402.5518   ,363.2422
                 21 ,2017-07-01 09:11:00      ,404.7830   ,360.2075
                 22 ,2017-07-01 09:10:00      ,403.7317   ,275.8560
                 23 ,2017-07-01 09:09:00      ,403.2151   ,276.8633
                 24 ,2017-07-01 09:08:00      ,404.2897   ,361.6937
                 25 ,2017-07-01 09:07:00      ,403.8227   ,355.2353
                 26 ,2017-07-01 09:06:00      ,402.8998   ,276.0700
                 27 ,2017-07-01 09:05:00      ,403.1328   ,362.2495
                 28 ,2017-07-01 09:04:00      ,404.1612   ,361.9048
                 29 ,2017-07-01 09:03:00      ,403.7537   ,274.9531
                 30 ,2017-07-01 09:02:00      ,402.1621   ,360.7682
                 31 ,2017-07-01 09:01:00      ,403.0805   ,360.8172
                 32 ,2017-07-01 09:00:00      ,403.3630   ,276.2874
                 33 ,2017-07-01 08:59:00      ,402.8351   ,275.9734
                 34 ,2017-07-01 08:58:00      ,403.6484   ,360.5585
                 35 ,2017-07-01 08:57:00      ,403.4342   ,357.7776
                 36 ,2017-07-01 08:56:00      ,402.4444   ,275.8763
                 37 ,2017-07-01 08:55:00      ,403.2913   ,361.2458
                 38 ,2017-07-01 08:54:00      ,403.2985   ,276.7728
                 39 ,2017-07-01 08:53:00      ,403.2600   ,276.6644
                 40 ,2017-07-01 08:52:00      ,401.9991   ,361.2737
                 41 ,2017-07-01 08:51:00      ,404.9158   ,358.2727
                 42 ,2017-07-01 08:50:00      ,403.8922   ,357.0592
                 43 ,2017-07-01 08:49:00      ,403.0070   ,359.5312
                 44 ,2017-07-01 08:48:00      ,404.8530   ,360.1790
                 45 ,2017-07-01 08:47:00      ,404.1543   ,359.4836
                 46 ,2017-07-01 08:46:00      ,403.9200   ,357.9064
                 47 ,2017-07-01 08:45:00      ,403.9197   ,358.6364
                 48 ,2017-07-01 08:44:00      ,406.0925   ,358.6248
                 49 ,2017-07-01 08:43:00      ,401.5529   ,359.9990
                 50 ,2017-07-01 08:42:00      ,402.4422   ,356.6060",sep=",",header=TRUE,stringsAsFactors=FALSE)

df$DateTime <- as.POSIXct(df$DateTime)

library(shiny)
ui <- shinyUI(fluidPage(

  titlePanel("Practice Reaction on Plot"),

  plotOutput("myPlot")

))

server <- shinyServer(function(input, output) {

  output$myPlot <- renderPlot({

    ggplot(df, aes(DateTime)) + ylab("Val") +
      geom_line(aes(y = Val1, colour = "Val1"),lwd=0.7) + 
      geom_line(aes(y = Val2, colour = "Val2"),lwd=0.8) + 
      expand_limits( y = 0) +
      scale_x_datetime(expand = c(0,0)) +
      theme(text = element_text(size=10),
            legend.text = element_text(size=10),
            panel.background = element_rect(fill = "white", colour = "black"))

  })
})
shinyApp(ui,server)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM