glänzend, timevis und html Vorlagen

Ich habe ein Problem, ein Timevis in einem HTML-Block in glänzend anzuzeigen.glänzend, timevis und html Vorlagen

der folgende Code ist die Basis Beispiel, das funktioniert:

library(shiny) 
library(timevis) 

data <- data.frame(
    id  = 1:4, 
    content = c("Item one", "Item two", 
       "Ranged item", "Item four"), 
    start = c("2016-01-10", "2016-01-11", 
       "2016-01-20", "2016-02-14 15:00:00"), 
    end  = c(NA, NA, "2016-02-04", NA) 
) 

ui <- bootstrapPage(
    timevisOutput("timeline") 
) 

server <- function(input, output, session) { 
    output$timeline <- renderTimevis({ 
    timevis(data) 
    }) 
} 

shinyApp(ui = ui, server = server)

aber wenn ich eine HTML-Vorlage verwenden und versuchen, den Inhalt anzuzeigen dies nicht angezeigt. Hier ist Beispielcode

library(shiny) 
    library(timevis) 

ui <- bootstrapPage(
      tags$div(id="page-content-wrapper", 
        timevisOutput("timeline") 
        ) 
) 

server <- function(input, output, session) { 
     output$timeline <- renderTimevis({ 
     timevis(data) 
    }) 



    } 

    shinyApp(ui = ui, server = server)

und die html die Referenz

<div id=" timeline " class="shiny-plot-output" style="width: 100%;height:200px;"></div>

eine Ahnung, warum dies geschieht enthalten? vermisse ich etwas? (dh angemessene Einbeziehung von js libs in der App-Header oder HTML-Datei?) Wenn jemand ein funktionierendes Beispiel mit htmlwidgets hat, könnte das auch eine Alternative sein, aber ich kann nichts zur Arbeit im Moment bekommen

Vorschläge sehr willkommen ! Danke

Quelle

2017-06-10 lorenzov

Kann nicht reproduzieren mit shiny_1.0.3, timevis_0.4, R_3.3.2, win7 – HubertL

Oh Mann, ich gab das Kopfgeld, weil OP mir eine E-Mail schickte und ich sagte, ich bin zu beschäftigt, um es zu überprüfen. Also wollte ich helfen, indem ich eine Prämie gebe ... vielleicht hätte ich 5 Minuten damit verbringen sollen, mich zu reproduzieren :) –

@DeanAttali Das ist ein Fehler, den neue Investoren oft machen: D – HubertL

Ich sehe nichts falsch mit Ihrem Code. Der einzige Grund, warum ich denken kann, könnten die veralteten Pakete sein: Hier sind die für meine Sitzung geladen Pakete:

loaded via a namespace (and not attached): 

[1] Rcpp_0.12.11 digest_0.6.12 rprojroot_1.2 mime_0.5  R6_2.2.1  backports_1.1.0 xtable_1.8-2 
[8] jsonlite_1.5 magrittr_1.5 evaluate_0.10 stringi_1.1.5 rmarkdown_1.5 tools_3.4.0  stringr_1.2.0 
[15] htmlwidgets_0.8 httpuv_1.3.3 yaml_2.1.14  rsconnect_0.8 compiler_3.4.0 htmltools_0.3.6 knitr_1.16

HTML-Code durch glänzende app produziert wird:

<!DOCTYPE html> 
<html> 
<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
<script type="application/shiny-singletons"></script> 
<script type="application/html-dependencies">json2[2014.02.04];jquery[1.12.4];shiny[1.0.3];htmlwidgets[0.8];vis[4.16.1];timeline[0.4];timevis-binding[0.4];bootstrap[3.3.7]</script> 
<script src="shared/json2-min.js"></script> 
<script src="shared/jquery.min.js"></script> 
<link href="shared/shiny.css" rel="stylesheet" /> 
<script src="shared/shiny.min.js"></script> 
<script src="htmlwidgets-0.8/htmlwidgets.js"></script> 
<link href="vis-4.16.1/vis.min.css" rel="stylesheet" /> 
<script src="vis-4.16.1/vis.min.js"></script> 
<link href="timeline-0.4/timevis.css" rel="stylesheet" /> 
<script src="timevis-binding-0.4/timevis.js"></script> 
<meta name="viewport" content="width=device-width, initial-scale=1" /> 
<link href="shared/bootstrap/css/bootstrap.min.css" rel="stylesheet" /> 
<script src="shared/bootstrap/js/bootstrap.min.js"></script> 
<script src="shared/bootstrap/shim/html5shiv.min.js"></script> 
<script src="shared/bootstrap/shim/respond.min.js"></script> 

</head> 

<body> 
    <div id="page-content-wrapper"> 
    <div id="timeline" class="timevis html-widget html-widget-output" style="width:100%; height:auto; "> 
     <div class="btn-group zoom-menu"> 
     <button type="button" class="btn btn-default btn-lg zoom-in" title="Zoom in">+</button> 
     <button type="button" class="btn btn-default btn-lg zoom-out" title="Zoom out">-</button> 
     </div> 
    </div> 
    </div> 
</body> 

</html>

Quelle

2017-06-13 03:39:49

@lorenzov könnten Sie bitte bestätigen, dass nach der Aktualisierung Ihrer Pakete, Ihre Das ursprüngliche Problem verschwindet?Wenn Sie bestätigen können, dass ich das Kopfgeld vergeben werde –

Ich fürchte nicht, wie jeder scheint sich auf das Beispiel konzentriert haben (das funktioniert schon, aber offensichtlich habe ich schlechte Dinge zu erklären, so werde ich weitere Informationen hinzufügen – lorenzov

das Kopfgeld läuft ab, also muss ich es vergeben, weil diese Antwort richtig ist, wenn man die Frage stellt.Sie können eine brandneue Frage schreiben, wenn Sie mehr Hilfe brauchen, stellen Sie einfach sicher, dass Sie ein reproduzierbares Beispiel geben –

Ich muss Danke meinem Kollegen @ZachA, da meine Frage nicht ganz korrekt war, aber da draußen ist sehr wenig dokumentiert, daher kann es für andere nützlich sein.

Zum Hinzufügen von benutzerdefinierten HTML zu glänzenden Apps gibt es mehrere Möglichkeiten, wie auf den R-Sites und -Artikeln dokumentiert (d. H. http://shiny.rstudio.com/articles/templates.html oder http://shiny.rstudio.com/articles/html-ui.html).

gibt es Schlepptau Möglichkeiten, um Dateien enthalten:

Include (‚yourfile‘) und htmlTemplate (‚yourfile‘)

das ist, wo das Problem, wie die Art und Weise ist die HTML gerendert wird, ist unterschiedlich und die Das Einbeziehen oder das Ausschließen von Headern in den Quell-HTML-Dateien verursachte mein Problem, besonders wenn Sie anfangen, die beiden Möglichkeiten zu mischen.

in meinem Fall mit htmlTemplate scheinen die Ursache zu sein; Ändern des Aufrufs in Datei zu includehtml löste es.

hier ist ein Bit des Codes

ui <- bootstrapPage(
tags$head(
    tags$script(src='js/custom.js') 
    ,tags$link(rel = "stylesheet", type = "text/css", href ='//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css') 
    ,tags$script(src='https://cdnjs.cloudflare.com/ajax/libs/vis/4.20.0/vis.min.js') 
    ,tags$script(src='http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js') 
    ,tags$link(rel = "stylesheet", type = "text/css", href ='css/style.css') 
    ,tags$link(rel = "stylesheet", type = "text/css", href ='css/myvis.css') 

), 
myuser = verbatimTextOutput("s_user"), 
tags$div(id="wrapper", 
    tags$div(class="overlay"), 
    tags$nav(class="navbar navbar-inverse navbar-fixed-top", id="sidebar-wrapper", role="navigation", includeHTML("./sidebar.html")), 
    tags$div(id="page-content-wrapper", htmlTemplate("./main.html")), 

    tags$div(class="container", 
     tags$div(class="row", 
       tabsetPanel(type="pills", 
        tabPanel("Overview", 
           htmlTemplate("html_template/overview.html") 
          ), 
        tabPanel("Streams", 
           includeHTML("html_template/streams.html") 
        ), 

        tabPanel("Budget", 
           includeHTML("html_template/budget.html") 
        ), 
        tabPanel("Status", 
           htmlTemplate("html_template/status.html") 
        ), 


        tabPanel("Milestones", 
           includeHTML("html_template/milestones.html") 
        ), 
        tabPanel("Risks", 
           htmlTemplate("html_template/risks.html") 
        ) 
        ) 

      ) 

    ) 
) 
)

zu erklären, wie Sie das bootstrapPage Layout sehen verwenden und die verschiedenen Bibliotheken mich (die stream.html Datei im Code) lösen half. am ende haben wir für maximale flexibilität das javascript in der template codiert und verwenden shinyjs um das json objekt zu füllen um den viz zu zeichnen.

Quelle

2017-06-16 07:32:00 lorenzov

glänzend, timevis und html Vorlagen

Antwort

Verwandte Themen