通过单击堆积的条形图打开选项卡 [英] Open tab by clicking on a stacked barchart

问题描述

我正在使用R，ggplot和plotly构建包含转发的堆叠式条形图.如果单击了条形图的一部分，我希望打开一个新的浏览器选项卡，并显示从该特定日期开始的带有指定转发量的推文.但是，当我在以下示例中单击其中一个栏时，将打开一个不同的链接，表明url与这些栏未正确连接.我该如何解决?

I'm building a stacked barchart containing retweets using R, ggplot and plotly. If a part of a barchart is clicked on, I want a new browser tab to open and show the tweet from this specific date with the indicated amount of retweets. However, when I click on one of the bars in the example below, a different link is opened, indicating that the url´s are not properly connected with the bars. How do I solve this?

我以前从未工作过，甚至从未看过JavaScript，因此答案很可能就在那里.该情节最终将出现在Shiny应用程序中.

I have never worked or even seen JavaScript before, so chances are high the answer is in there. The plot is eventually meant to appear in a Shiny application.

library(rtweet)
library(ggplot2)
library(plotly)

# Get tweets
tweets <- get_timeline("BBC", n = 10)

# Create dataframe
data <- data.frame("retweet_count" = tweets$retweet_count,
                   "week" =  c(1,1,1,2,2,3,4,5,5,6),
                   "url"  =  tweets$status_url)

# Create ggplot
ggplot(data = data,
           aes(x = week,
           y = retweet_count,
           label = url)) + 
  geom_bar(stat = 'sum', 
           fill = "darkblue")

# Convert to plotly
p <- ggplotly(
  p,
  tooltip = c("y", 'label'))

# Add URL data to plot
p$x$data[[1]]$customdata <- data$url

# JS function to make a tab open when clicking on a specific bar
onRender(
  p,
  "
    function(el,x){
    el.on('plotly_click', function(d) {
    var websitelink = d.points[0].customdata;
    window.open(websitelink);
    });
    }
    ")

推荐答案

我没有Twitter帐户，因此我更改了数据集以使用一些Wikipedia文章.

I don't have a twitter account, so I changed your dataset to use some Wikipedia articles.

可以根据URL重新排序data.frame来解决您的问题.如果使用1:9中的文章运行以下内容，则一切正常.使用链接9:1切换到数据集后，您将获得错误的链接.似乎在内部重新排序-与

Your problem can be resolved by reordering your data.frame according to the URLs. If you run the below with articles from 1:9 everything works as expected. Once you switch to the dataset with links 9:1 you'll get the wrong links. Plotly seems to reorder internally - Same logic as here.

以您的情况为例:data <- data[order(data$url),]应该确定订单.

In your case: data <- data[order(data$url),] should fix the order.

以下工作正常:

# library(rtweet)
library(ggplot2)
library(plotly)
library(htmlwidgets)

# Get tweets
# tweets <- get_timeline("BBC", n = 10)

# Create dataframe
# data <- data.frame("retweet_count" = tweets$retweet_count,
#                    "week" =  c(1,1,1,2,2,3,4,5,5,6),
#                    "url"  =  tweets$status_url)

# Create dataframe
# Works!
data <- data.frame("retweet_count" = 1:9,
                   "week" =  1:9,
                   "url"  =  paste0(c("https://en.wikipedia.org/wiki/166"), 1:9))
# Doesn't work!
# data <- data.frame("retweet_count" = 9:1,
#                    "week" =  9:1,
#                    "url"  =  paste0(c("https://en.wikipedia.org/wiki/166"), 9:1))

# Create ggplot
p <- ggplot(data = data,
       aes(x = week,
           y = retweet_count,
           label = url)) + 
  geom_bar(stat = 'sum', 
           fill = "darkblue")

# Convert to plotly
p <- ggplotly(
  p,
  tooltip = c("y", 'label'))

# Add URL data to plot
p$x$data[[1]]$customdata <- data$url

# JS function to make a tab open when clicking on a specific bar
onRender(
  p,
  "
    function(el,x){
    el.on('plotly_click', function(d) {
    var websitelink = d.points[0].customdata;
    window.open(websitelink);
    });
    }
    ")

这篇关于通过单击堆积的条形图打开选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！