2017-01-21 5 views
1

ShinyとJavaScriptの間に通信の問題がある可能性がありますが、HTML divオブジェクトを選択したデータベースの長さと同じにするShinyアプリケーションを作りたいと思います。RStudio ShinyとJavaScriptの通信の問題

Shiny.addCustomMessageHandlerを使用しようとしましたが、機能内でのみ情報を送信するようです。

ui.r

server.r

library(shiny) 

shinyServer(
function(input, output, session) { 
    database <- reactive({ 
     get(input$database) 
    }) 

    observe({ 
    session$sendCustomMessage(type = 'testmessage', message = ncol(database())) 
    }) 
}) 

:私の目標は、ここで

(データベースを())のNcoIするMSG変数の値を変更するために、最小限の例です
library(shiny) 

shinyUI(fluidPage(
    tags$head(tags$script(src="script.js")), 

    fluidRow(
    # TITLE 
    titlePanel("title"), 

    # SIDEBAR 
    sidebarPanel(width = 2, 
     selectInput("database", "Select sample database:", choices = c("mtcars","iris","Titanic","AirPassengers")) 
    ) 
), 

    # MAIN-PANEL 
    column(width = 8, 
    tabsetPanel(type = "pills", 
     tabPanel("view",   
      tags$div(id="target") 
     ) 
)) 
)) 

script.js

$(document).on('shiny:connected', function(event) { 

      var msg; 
      Shiny.addCustomMessageHandler("testmessage", 
       function(message) { 
       msg = message;          
       } 
      ); 

      for(var i =1; i<= msg; i++){ 
      $('#target').append($('<div/>', { id: 'targ' + i, 'class' : 'col-md-4'})) 
      } 
}); 

ありがとうございました!

UPDATE1:

私はこのようなプロットを生成します:

$(document).ready(function() { 
    Shiny.addCustomMessageHandler("testmessage", 
    function(message) { 
     updateTargetDiv(message); 
    } 
    ); 
}); 

function updateTargetDiv(msg){ 
     node = document.getElementById('target'); 
     while (node.hasChildNodes()) { 
      node.removeChild(node.lastChild); 
     } 
     for(var i =1; i<= msg; i++){ 
     $('#target').append($('<div/>', { id: 'targ' + i, 'class' : 'col-md-4'})); 
     } 

      for(var i =1; i<= msg; i++){ 
       $('#targ' + i).append($('<div/>', { id: 'plot' + i, 'class' : 'col-md-3 shiny-plot-output'})) 
       $('#targ' + i).append($('<div/>', { id: 'summary' + i, 'class' : 'col-md-1 shiny-html-output'})) 
      } 
} 

server.r

observe({ 
     for (i in 1:ncol(database())) { 
     local({ 
      my_i = i 
      output[[paste0('plot',i)]] <- renderPlot({ 
       db = database() 
       ggplot(data = db, 
        aes_string(colnames(db)[my_i])) + 
       geom_histogram() 
      }) 

      output[[paste0('summary',i)]] <- renderTable({ 
       db = database() 
       mat = matrix(NA,6,2) 
       mat[,1] = names(summary(db[,my_i])) 
       mat[,2] = summary(db[,my_i]) 
       mat 
      }, include.colnames=FALSE) 
     }) 
     } 
    }) 

私はできないSEのいずれかのプロット。どうして? (JavaScriptの動的divスクリプトなしで動作します)

答えて

1

あなたの説明に基づいて、主な問題はJavaScript関数を一度呼び出すことだと思います。 .on('shiny:connected' ...は開始時に一度だけ呼び出されます。

もう1つの問題は、ターゲットdivに追加しているだけなので、その子をクリアしない限り成長し続けるということです。div要素。

私は以下のコードがあなたのニーズに合っていると思います。これはCustomMessageHandlerを一度作成し、新しい値が渡されるたびにupdateTargetDivを呼び出します。また、新しいものを作成する前に子のdiv要素をクリアします。

$(document).ready(function() { 
    Shiny.addCustomMessageHandler("testmessage", 
    function(message) { 
     updateTargetDiv(message); 
    } 
); 
}); 

function updateTargetDiv(msg){ 
     node = document.getElementById('target'); 
     while (node.hasChildNodes()) { 
      node.removeChild(node.lastChild); 
     } 
     for(var i =1; i<= msg; i++){ 
     $('#target').append($('<div/>', { id: 'targ' + i, 'class' : 'col-md-4'})); 
     } 
} 

ビジュアル: enter image description here

+0

はありがとうございました!完璧な解決策、私はもう少し少し質問がある、私は私の質問を更新しました。 – Slownz

関連する問題