plotGoogleMaps nell'app lucida

Question

Ho pensato che sarebbe stato fantastico usare plotGoogleMaps in un'app lucida per analizzare e visualizzare dinamicamente i dati spaziali usando R. Non ho mai usato alcun pacchetto prima (sono relativamente nuovi) e non hanno molto esperienza di programmazione, così ho iniziato con le esercitazioni e gli esempi per ciascuno e poi ho provato a mescolarli insieme.

Posso far funzionare tutti i singoli elementi del codice, ma l'esecuzione dell'app non mostra la mappa di google. Immagino che abbia a che fare con plotGoogleMaps che tenta di tracciare in un browser e che sta cercando di renderizzare la trama in un browser, ma non so come risolverlo. Ho tirato la maggior parte del codice di lucido da the shiny tutorial Inputs & Outputs e seguii il codice plotGoogleMaps Tutorial

prova:

#load packages and data 
library(shiny) 
library(plotGoogleMaps) 
data(meuse) 

#convert data frame to SpatialPointDataFrame and set 
coordinates(meuse)<-~x+y 
proj4string(meuse) <- CRS('+init=epsg:28992') 

#will need to select column name for app, maybe not best way to do this, 
#but seems to work 
formulaText<-paste('zinc') 

#plot data on Google map, opens browser and works 
mpgPlot <- plotGoogleMaps(meuse, zcol=formulaText) 

ui.R

library(shiny) 

# Define UI for meuse test 
shinyUI(pageWithSidebar(

    # Application title 
    headerPanel("Meuse Test"), 

    # Sidebar with controls to select the variable to plot on map 
    sidebarPanel(
     selectInput("variable", "Variable:", 
           choices=list("Zinc" = "zinc", 
             "Lead" = "lead", 
             "Copper" = "copper"), 
           selected="Zinc") 

    ), 

    # Show the caption and plot of the requested variable on map 
    mainPanel(
     plotOutput("mapPlot") 
    ) 
)) 

server.R

library(shiny) 
library(plotGoogleMaps) 

data(meuse) 
coordinates(meuse)<-~x+y 
proj4string(meuse) <- CRS('+init=epsg:28992') 

# Define server logic required to plot various variables on map 
shinyServer(function(input, output) { 

    # Compute the forumla text in a reactive expression since it is 
    # shared by the output$mapPlot ?I think I still need to do this... 
    formulaText <- reactive({ 
#paste the input name in so it follows argument format for plotGoogleMaps? 
#tried without, don't think it is probelm, works with test code... 
     paste(input$variable) 
    }) 


    # Generate a plot of the requested variable against mpg and only 
    # include outliers if requested 
    output$mapPlot <- renderPlot({ 
     plotGoogleMaps(meuse, zcol=formulaText) 
#also tried to specify alternative arguments like add=TRUE, 
#filename='mapPlot.htm', openMap=FALSE 
    }) 
}) 

Capisco sia lucido e plotGoogleMaps sono piuttosto nuovi e ho visto alcuni suggerimenti posta domande al gruppo di Google lucido, ma non voglio raddoppiare post e StackOverflow è il mio go per le risposte. Finalmente vorrei anche dare un piccolo contributo a una comunità che mi ha aiutato così tanto finora! Se questo è solo un approccio pessimo Sono aperto alle alternative, sto controllando googleVis ora ...

Grazie, Alex

PS-

sessionInfo() 
R version 3.0.1 (2013-05-16) 
Platform: x86_64-w64-mingw32/x64 (64-bit) 

locale: 
[1] LC_COLLATE=English_United States.1252 
[2] LC_CTYPE=English_United States.1252 
[3] LC_MONETARY=English_United States.1252 
[4] LC_NUMERIC=C       
[5] LC_TIME=English_United States.1252  

attached base packages: 
[1] grid  stats  graphics grDevices utils  datasets methods 
[8] base  

other attached packages: 
[1] googleVis_0.4.3 plotGoogleMaps_2.0 maptools_0.8-25 
[4] lattice_0.20-15 foreign_0.8-54  rgdal_0.8-10  
[7] sp_1.0-11   shiny_0.6.0  

loaded via a namespace (and not attached): 
[1] bitops_1.0-5 caTools_1.14 digest_0.6.3 httpuv_1.0.6.3 
[5] Rcpp_0.10.4 RJSONIO_1.0-3 tools_3.0.1 xtable_1.7-1 

PPS ho letto this post diverse volte prima di postare, ma ora sono sospettoso la mia risposta è lì. Appologie se la domanda è duplice. Penso che sia qualcosa con htmlOutput() ... ?htmlOutput è scarsa ... Mi sento denso ...

Answer 1

(disclaimer: non sono un esperto lucido)

renderPlot funziona con il dispositivo grafico R. In questo caso, plotGoogleMaps sta generando un file HTML autonomo, che non viene trasmesso al dispositivo grafico.

Poiché i file .html generati da plotGoogleVis sono progettati per essere isolati (ovvero non sono frammenti di documento che potrebbero essere legalmente inseriti nel documento dell'app Shiny), penso che sarà necessario incorporarli in un iframe in farli eseguire correttamente il rendering (cioè avere l'output plotGoogleVis in un file, quindi caricare il file in ui.R utilizzando tags$iframe).

Se il tuo obiettivo generale è solo visualizzare i dati su una mappa, potresti avere più fortuna con Leaflet - c'è già un pacchetto che fornisce Shiny to Leaflet bindings.

Answer 2

Non so molto di plotGoogleMaps, ma come ha detto Jonathan sembra che stia generando un HTML piuttosto che una trama che è possibile utilizzare per Shiny.

Con un po 'di sforzo è possibile associare a Google Maps Lucido. Probabilmente vorrai abbandonare lo ui.R e utilizzare uno custom HTML front-end con una mappa di Google (read up on the Google Map developer guide here).Si pagina sarà iniziare in questo modo (direttamente da "Ciao mondo" l'esempio di Google):

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map-canvas { height: 100% } 
    </style> 
    <script type="text/javascript" 
     src="https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=SET_TO_TRUE_OR_FALSE"> 
    </script> 
    <script type="text/javascript"> 
     function initialize() { 
     var mapOptions = { 
      center: new google.maps.LatLng(-34.397, 150.644), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map-canvas"), 
      mapOptions); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="map-canvas"/> 
    </body> 
</html> 

Non dimenticate di aggiungere nella vostra chiave API sopra. Ora è necessario scrivere la rilegatura (see tutorial). Ecco un esempio per iniziare:

var map_binding = new Shiny.OutputBinding(); 

$.extend(map_binding, { 

    find: function(scope) { 
    return $(scope).find('#map-canvas'); 
    }, 

    renderValue: function(el, data) { 

    // Parse the data sent from R. 
    var map_data = jQuery.parseJSON(data); 

    // ... 
    // Render points or whatever on map. 
    /// 

    } 
}); 

Shiny.outputBindings.register(map_binding, "map_binding"); 

Includere questo in un file JavaScript separato e caricarlo nella testa della pagina HTML.

È necessario modificare renderValue() in modo che i dati provenienti da R vengano visualizzati sulla mappa. renderValue() sarà chiamato ogni volta che la mappa viene aggiornata. Per vedere come mostrare effettivamente i punti (o qualsiasi cosa tu stia visualizzando) sulla mappa, guarda di nuovo la documentazione di Google (e.g. here) che generalmente fornisce la maggior parte del codice che ti servirà.

ora sul lato R, si avrà qualcosa di simile nel server.R:

output$map <- renderText({ 
    RJSONIO::toJSON(some_data) 
}) 

Dove manderai qualsiasi dato per la mappa per essere rappresentate graficamente, (tramite la funzione renderValue()).

Answer 3

Grazie a ramnathv's code sono riuscito a incorporare plotGoogleMaps a lucido, senza alcuna conoscenza di programmazione html:

library(plotGoogleMaps) 
library(shiny) 

runApp(list(
    ui = pageWithSidebar(
    headerPanel('Map'), 
    sidebarPanel(""), 
    mainPanel(uiOutput('mymap')) 
    ), 
    server = function(input, output){ 
    output$mymap <- renderUI({ 
     data(meuse) 
     coordinates(meuse) = ~x+y 
     proj4string(meuse) <- CRS("+init=epsg:28992") 
     m <- plotGoogleMaps(meuse, filename = 'myMap1.html', openMap = F) 
     tags$iframe(
     srcdoc = paste(readLines('myMap1.html'), collapse = '\n'), 
     width = "100%", 
     height = "600px" 
    ) 
    }) 
    } 
)) 

Nota che la leggenda non viene visualizzato. Ho già posted a question about this issue altrove.