Question

这是我的问题。是否可以从R Highchart中的Highcharts复制以下示例？想法是在选择点时出现的弹出窗口中引入各种文本。

这是我到目前为止尝试过的：

data <- data.frame(x = c(1,2,3,4,5,6),
               y = c(2,4,1,5,2,6))

highchart() %>% 
  hc_add_series(data, "line") %>% 
  hc_tooltip(shared = T,
             crosshairs = T) %>% 
  hc_plotOptions(
    series = list(
      cursor = "pointer",
      point = list(
        events = list(click = JS("function () {
                                          hs.htmlExpand(null, {
                                          pageOrigin: {
                                          x: this.pageX,
                                          y: this.pageY
                                          },
                                          headingText: 'testing1',
                                          maincontentText: 'testing2',
                                          width: 310,
                                          height: 500
                                          });
                                          }")))
    ))

如果我们可以解决这个问题，那么也许我们可以做这样的事情：http://jsfiddle.net/y4JV5/4/

谢谢

Answer 1

对于所有感兴趣的人，这里是上述问题的解决方案。我仍在研究使用“ htmlExpand”功能显示图表的解决方案。 http://jsfiddle.net/y4JV5/4/

library(shiny)
library(highcharter)

data <- data.frame(x = c(1,2,3,4),
                   y = c(2,1,5,1))



js_func <- JS("function (event) {
                 hs.htmlExpand(null, {
                    pageOrigin: {
                      x: event.pageX || event.clientX,
                      y: event.pageY || event.clientY
                 },
                 headingText: event.point.series.name,
                 maincontentText:  'This point has coordinates: (' + event.point.x + ', ' + event.point.y + ')' , 
                 height: 100,
                 width: 250
             }); 
            }")

ui <- fluidPage(
   tags$head(HTML("\n<script src='https://www.highcharts.com/media/com_demo/js/highslide-full.min.js'></script>
             \n<script src='https://www.highcharts.com/media/com_demo/js/highslide.config.js' charset='utf-8'></script>
            \n<link rel='stylesheet' type='text/css' href='https://www.highcharts.com/media/com_demo/css/highslide.css'/>")),

   highchartOutput("a1")
)

server <- function(input, output){

  output$a1 <- renderHighchart({

   highchart() %>% 
     hc_add_series(data, "line", hcaes(x,y), name = "Sample Series") %>% 
     hc_plotOptions(series = list(
        cursor = "pointer",
        events = list(click = js_func)
     ))

 })

}

shinyApp(ui, server)

最困难的部分是将数据链接到“ hs.htmlExpand”部分。仅使用event.point完成此操作。

希望这会有所帮助。

Highcharter R Shiny中的Clickable Points弹出窗口

1 个答案: