光沢のあるhtmlOutputは2回目の入力変更で反応しません

私はshinyappを使ってGoogleの単語ツリーの可視化を生成しています。 shinyappインターフェイスには2つの入力があります。テキストと用語。私は選択されたテキストのためにdata.frameをサブセット化し、htmlテンプレート内の必要なコンテンツを置き換えます。光沢のあるhtmlOutputは2回目の入力変更で反応しません

テンプレートは、問題は一度だけ、shinyappの変化である、ここでhttps://developers.google.com/chart/interactive/docs/gallery/wordtree

です。 2回目にテキストや用語を変更すると、htmlページが白くなります。フォルダ上のファイルをチェックすると、htmlファイルの内容は変わってしまいますが、光沢のあるページには表示されません。

app.R

shinyApp(
    ui = fluidPage(
    fluidRow(
     column(width = 6, selectInput("input.filter", label = "selec text", choices = mytexts$yazi.header, selected = "text 1")) , 
     column(width = 6,textInput("input.term", "type term", "today")) 
    ), 
    fluidRow(tags$head(titlePanel("title panel"))), 
    fluidRow(htmlOutput("treehtml")) 
) , 
server = function(input, output, session) { 
    output$treehtml <- reactive({ 
    print(input$input.filter) 
    print(input$input.term) 
    xid <- subset(mytexts, yazi.header == if(is.null(input$input.filter)) {"text 1"} 
        else {input$input.filter}) 
    print(xid$L1) 
    xxwt <- mytexts.cumle[mytexts.cumle$cumleid == xid$L1, ] 
    xxwt <- paste("['", paste(xxwt$clean, collapse = "'], ['"), "'],", sep = "") 
    wttemp <- paste(readLines("wordtree/_wordtree_tmp.html"), collapse="\n") 
    wttemp <- gsub("today",input$input.term, wttemp, fixed = TRUE) 
    wttemp <- gsub("['DEMO1 DEMO2 DEMO3'],",xxwt, wttemp, fixed = TRUE) 
    write(wttemp, "wordtree/wttemp.html") 
    wttemp 
    }) 
})

wordtree/_wordtree_tmp.html

<html> 
<head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript"> 
     google.charts.load('current', {packages:['wordtree']}); 
    google.charts.setOnLoadCallback(drawChart); 

    function drawChart() { 
     var data = google.visualization.arrayToDataTable(
     [ ['DEMO DEMO DEMO'], ] 
    ); 

     var options = { 
     wordtree: { 
      format: 'implicit', 
      type: 'double', 
      word: 'today' 
     } 
     }; 

     var chart = new google.visualization.WordTree(document.getElementById('wordtree_basic')); 
     chart.draw(data, options); 
    } 
    </script> 
</head> 
<body> 
     <div id="wordtree_basic" style="width: 900px; height: 500px;"></div> 
</body> 
</html>

出典

2017-02-19 Selcuk Akbas

だけコメント：私はこれが原因であるかどうかわかりませんが、あなたが入力IDの（input.term' 'のような）にドットを避ける必要があります。 –

ありがとう、私はそれを以前聞いていない。私は試みたが、うまくいかなかった。 –

あなたの投稿にデータフレーム 'mytexts'と' mytexts.cumle'を指定していません。だから私たちは再現できません。また、 '_wordtree_tmp.html'は、' html'、 'head'、' body'タグ付きの完全なhtmlファイルです。あなたのアプリはこのHTMLを 'div'の中に置き、このhtmlをレンダリングすることになっています。私はhtmlの専門家ではないが、これが可能ならば驚くだろう。 –

機能shinyjsのrunjsを使用して、例えば次のようにあなたが行うことができます。

library(shiny) 
library(shinyjs) 
library(jsonlite) 

sentences <- data.frame(
    group = c("A","A","A","A","A","A","A","A","A","A","B","B","B","B","B","B","B","B","B"), 
    sentence = c("Phrases", "cats are better than dogs", "cats eat kibble", 
       "cats are better than hamsters", "cats are awesome", "cats are people too", 
       "cats eat mice", "cats meowing", "cats in the cradle", "cats eat mice", 
       "cats in the cradle lyrics", "cats eat kibble", "cats for adoption", 
       "cats are family", "cats eat mice", "cats are better than kittens", 
       "cats are evil", "cats are weird", "cats eat mice"), 
    stringsAsFactors = FALSE 
)  

drawChart <- function(sentences, word){ 
    sprintf("google.charts.load('current', {packages:['wordtree']}); 
google.charts.setOnLoadCallback(drawChart); 

function drawChart() { 
    var data = google.visualization.arrayToDataTable(
      %s 
); 

    var options = { 
    wordtree: { 
     format: 'implicit', 
     word: '%s' 
    } 
    }; 

    var chart = new google.visualization.WordTree(document.getElementById('wordtree_basic')); 
    chart.draw(data, options); 
} 
", toJSON(sentences), word) 
} 

shinyApp(
    ui = fluidPage(
    tags$head(
     tags$script(src="https://www.gstatic.com/charts/loader.js") 
    ), 
    useShinyjs(), 
    fluidRow(
     column(width=6, 
     selectInput("filter", label="select group", choices=c("A","B"), selected="A", selectize=FALSE) 
    ), 
     column(width=6, 
     textInput("word", "type word", "cats") 
    ) 
    ), 
    fluidRow(tags$head(titlePanel("title panel"))), 
    fluidRow(tags$div(id="wordtree_basic", style="width: 900px; height: 500px;")) 
), 

    server = function(input, output, session) { 
    observe({ 
     dat <- subset(sentences, group==input$filter)$sentence 
     sentences <- array(dat, dim=c(length(dat),1)) 
     runjs(drawChart(sentences, input$word)) 
    }) 
    } 
)

出典

2017-02-20 01:14:45

ありがとう、これは素晴らしいです。私はいくつかのjsを学ぶ方が良いでしょう:) –

光沢のあるhtmlOutputは2回目の入力変更で反応しません

答えて

関連する問題