2016-05-13 5 views
1

Ich möchte einige Informationen erkennen, wenn der Benutzer in einer Leiste einer Spalte Highchart Plot klickt. Ich muss den Namen und die Kategorie der angeklickten Leiste kennen, wenn der Name in der Legende gewählt wurde oder wenn auf den Hintergrund geklickt wurde. Der Name Teil ist in Ordnung, aber ich kann nicht herausfinden, welcher JS-Code ich schreiben muss, um diese Art von Information zu kennen.Wie Informationen über die angeklickte Leiste in highchart Spalte r glänzend plot zu wissen

Vielen Dank

library("shiny") 
library("highcharter") 

ui <- shinyUI(
    fluidPage(
    column(width = 8, highchartOutput("hcontainer", height = "500px")), 
    column(width = 4, textOutput("text")) 
) 
) 

server <- function(input, output) {  

    a <- data.frame(b = LETTERS[1:10], c = 11:20, d = 21:30, e = 31:40) 

    output$hcontainer <- renderHighchart({  

    myClickFunc <- JS("function(event) {Shiny.onInputChange('hcClicked', this.name);}") 

    highchart() %>% 
     hc_xAxis(categories = a$b) %>% 
     hc_add_serie(name = "c", data = a$c) %>% 
     hc_add_serie(name = "d", data = a$d) %>% 
     hc_add_serie(name = "e", data = a$e) %>% 
     hc_plotOptions(series = list(stacking = FALSE, events = list(click = myClickFunc))) %>% 
     hc_chart(type = "column") 

    })  

    output$text <- renderText({ 
    input$hcClicked   
    }) 
} 

Neue Fragen Wenn ich auf deaktivieren und unmittelbar nach einer Spalte zu aktivieren, kann ich das zweite Ereignis nicht erkennen. Wie kann ich erkennen, ob eine Spalte oder die Legende deaktiviert und aktiviert wurde (oder umgekehrt), ohne dass ein anderes Ereignis in der Mitte liegt?

Andere Frage ist: Es ist möglich, einen Klick auf den Grundstück Hintergrund zu erkennen?

Dank

Antwort

5

ich wahrscheinlich mehr ins Detail dieses Mal gehen werde, was Sie tun können und welche Möglichkeiten Sie haben:

A highchart Event-Funktion immer die Form JS("function(event) { ... }") hat. Die JS steht für JavaScript und verhindert, dass R den Code darin interpretiert. Glücklicherweise ähnelt JavaScript stark R, was das Schreiben von Anweisungen erleichtert, auch wenn Sie kein JavaScript kennen.

Die Funktion innen muss immer einen event Parameter haben. Aus der Dokumentation highcharts hat dieses Ereignis mehrere Eigenschaften, allen voran point. Auf Eigenschaften in JavaScript kann mit einem Punkt . zugegriffen werden, genau wie mit einem $ in R. So wird event.point der Punkt sein, auf den Sie geklickt haben.

Nun, dieser Punkt hat auch viele Eigenschaften, von denen die meisten nicht sehr nützlich sind. Aber mögliche Werte, die Sie möglicherweise verwenden möchten, sind category, color, x und y für entsprechende Achsenwerte. Wenn Sie also den y-Wert des angeklickten Punktes wissen möchten, ist der Befehl event.point.y. Ein anderes Beispiel: In Ihrem Fall würde event.point.x den Wert x ergeben, der im Fall eines Balkendiagramms nicht category ist, sondern der Index der category (Zählung beginnt hier bei 0). Im vorherigen Beispiel (Ihr Code-Snippet) habe ich auch das Objekt this verwendet. this steht für die series, auf die geklickt wurde. Dies ist nur eine Abkürzung, denn Sie können die Serie auch über event.point.series erhalten. Und die Reihe selbst hat viele Eigenschaften, wie z. B. die name.

Hinweis zu JavaScript: Listen (Arrays) in JavaScript werden mit den Klammern [ ... ] erstellt. Ich habe dies im folgenden Code verwendet, um mehrere Werte in einem Befehl zu senden.

Das ist der erste Teil. Jetzt möchten Sie die Auswahl Ihrer glänzenden App mitteilen. Shiny hat zu diesem Zweck eingebaute Informationskanäle. Eine davon ist die JavaScript-Funktion Shiny.onInputChange. Diese Funktion hat zwei Argumente, der zweite ist der Wert, den Sie senden möchten. Der erste ist der Name, unter dem Sie später auf den Wert zugreifen möchten. So ist die Verwendung immer Shiny.onInputChange('myVar', value). Jetzt wird dieser Wert an Ihren Server gesendet und ist unter input$myVar erreichbar. Dort haben Sie die gleichen Regeln wie für jede andere Eingabe.Sie können input$myVar in reaktive Umgebungen setzen und sie werden reagieren, wenn etwas Neues an input$myVar gesendet wird.

In Bezug auf Ihre direkte Anfrage: Zu wissen, zu welcher Kategorie der angeklickte Wert gehört, kann erreicht werden, indem die anfängliche Klick-Funktion nur ein wenig geändert wird. (Ich habe die Funktionen umbenannt, um sie ihren Funktionen anzupassen.) Die obige Erklärung sollte es verständlich machen. Das zweite Feature mit der Legende "click" verwendet ein anderes Ereignis "slot", das in highcharts integriert ist. Die legendItemClick funktioniert genau wie die normale click, hört aber nur auf Legende klickt. Es gibt einige weitere Event-Handler, die zugewiesen werden können, d. H. mouseOver, wenn Sie Hover-Ereignisse benötigen.

Okay, jetzt ist hier ein Beispielcode ein funktionierendes Beispiel für das, was ich oben geschrieben habe:

Mit freundlichen Grüßen

library("shiny") 
library("highcharter") 

ui <- shinyUI(
    fluidPage(
    column(width = 8, highchartOutput("hcontainer", height = "500px")), 
    column(width = 4, textOutput("text")) 
) 
) 

server <- function(input, output) {  

    a <- data.frame(b = LETTERS[1:10], c = 11:20, d = 21:30, e = 31:40) 

    output$hcontainer <- renderHighchart({  

    canvasClickFunction <- JS("function(event) {Shiny.onInputChange('canvasClicked', [this.name, event.point.category]);}") 
    legendClickFunction <- JS("function(event) {Shiny.onInputChange('legendClicked', this.name);}") 

    highchart() %>% 
     hc_xAxis(categories = a$b) %>% 
     hc_add_series(name = "c", data = a$c) %>% 
     hc_add_series(name = "d", data = a$d) %>% 
     hc_add_series(name = "e", data = a$e) %>% 
     hc_plotOptions(series = list(stacking = FALSE, events = list(click = canvasClickFunction, legendItemClick = legendClickFunction))) %>% 
     hc_chart(type = "column") 

    })  

    makeReactiveBinding("outputText") 

    observeEvent(input$canvasClicked, { 
    outputText <<- paste0("You clicked on series ", input$canvasClicked[1], " and the bar you clicked was from category ", input$canvasClicked[2], ".") 
    }) 

    observeEvent(input$legendClicked, { 
    outputText <<- paste0("You clicked into the legend and selected series ", input$legendClicked, ".") 
    }) 

    output$text <- renderText({ 
    outputText  
    }) 
} 

shinyApp(ui, server) 
+0

Great! Vielen Dank! – hsilva

+0

Sehr gute Antwort! – jbkunst