在 Plotly 图表中禁用交互性

【问题标题】：Disable interactivity in Plotly chart在 Plotly 图表中禁用交互性
【发布时间】：2017-09-25 12:33:46
【问题描述】：

我有以下数据 (dotplot_data)

structure(list(Kanton = structure(c(8L, 8L, 13L, 13L, 18L, 18L, 
25L, 25L, 17L, 17L, 24L, 24L, 20L, 20L, 19L, 19L, 5L, 5L, 22L, 
22L, 7L, 7L, 16L, 16L, 4L, 4L, 9L, 9L, 21L, 21L, 26L, 26L, 14L, 
14L, 23L, 23L, 15L, 15L, 11L, 11L, 6L, 6L, 3L, 3L, 10L, 10L, 
2L, 2L, 1L, 1L, 12L, 12L), .Label = c("GE", "NE", "VD", "BL", 
"ZG", "TI", "SO", "ZH", "SH", "VS", "TG", "JU", "BE", "SG", "AG", 
"BS", "SZ", "LU", "GL", "NW", "AR", "FR", "GR", "OW", "UR", "AI"
), class = "factor"), Jahr = structure(c(1L, 7L, 1L, 7L, 1L, 
7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 
7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 
7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L), .Label = c("2009", 
"2010", "2011", "2012", "2013", "2014", "2015"), class = "factor"), 
    Verhältnis = c(0.18245716727989, 0.234567735045611, 0.24932014665891, 
    0.282991259307219, 0.291667314781689, 0.34810778972169, 0.434262510974539, 
    0.47438822065533, 0.290624277074589, 0.333502152443657, 0.405097486492835, 
    0.444295001120825, 0.318638617178079, 0.366800362271963, 
    0.344886447973876, 0.366559250036619, 0.158794683184927, 
    0.200541172129635, 0.310803517571986, 0.373802102210946, 
    0.17589414669752, 0.223276715892796, 0.29494992542084, 0.306316282635547, 
    0.194661570513323, 0.197384284340806, 0.193617140613607, 
    0.236622748050551, 0.33538817183587, 0.367132867132867, 0.444847450394709, 
    0.511295616914462, 0.243694965319972, 0.283000330472218, 
    0.326857179802159, 0.380211750671041, 0.253870012888241, 
    0.301849570094465, 0.213009063138175, 0.262879934417959, 
    0.166988156513917, 0.20723066336873, 0.121289379668724, 0.160165035560148, 
    0.214926378302262, 0.262849338486695, 0.125824437342762, 
    0.145818371743814, 0.0331743010407139, 0.0607599044903447, 
    0.229837043837503, 0.277344272528649), GDEKT = c("ZH", "ZH", 
    "BE", "BE", "LU", "LU", "UR", "UR", "SZ", "SZ", "OW", "OW", 
    "NW", "NW", "GL", "GL", "ZG", "ZG", "FR", "FR", "SO", "SO", 
    "BS", "BS", "BL", "BL", "SH", "SH", "AR", "AR", "AI", "AI", 
    "SG", "SG", "GR", "GR", "AG", "AG", "TG", "TG", "TI", "TI", 
    "VD", "VD", "VS", "VS", "NE", "NE", "GE", "GE", "JU", "JU"
    ), Verhältnis_label = c("   18.2%", "   23.5%", "   24.9%", 
    "   28.3%", "   29.2%", "   34.8%", "   43.4%", "   47.4%", 
    "   29.1%", "   33.4%", "   40.5%", "   44.4%", "   31.9%", 
    "   36.7%", "   34.5%", "   36.7%", "   15.9%", "   20.1%", 
    "   31.1%", "   37.4%", "   17.6%", "   22.3%", "   29.5%", 
    "   30.6%", "   19.5%", "   19.7%", "   19.4%", "   23.7%", 
    "   33.5%", "   36.7%", "   44.5%", "   51.1%", "   24.4%", 
    "   28.3%", "   32.7%", "   38%", "   25.4%", "   30.2%", 
    "   21.3%", "   26.3%", "   16.7%", "   20.7%", "   12.1%", 
    "   16%", "   21.5%", "   26.3%", "   12.6%", "   14.6%", 
    "   3.3%", "   6.1%", "   23%", "   27.7%"), Kanton_label = c("ZH 18.2%   ", 
    "ZH 23.5%   ", "BE 24.9%   ", "BE 28.3%   ", "LU 29.2%   ", 
    "LU 34.8%   ", "UR 43.4%   ", "UR 47.4%   ", "SZ 29.1%   ", 
    "SZ 33.4%   ", "OW 40.5%   ", "OW 44.4%   ", "NW 31.9%   ", 
    "NW 36.7%   ", "GL 34.5%   ", "GL 36.7%   ", "ZG 15.9%   ", 
    "ZG 20.1%   ", "FR 31.1%   ", "FR 37.4%   ", "SO 17.6%   ", 
    "SO 22.3%   ", "BS 29.5%   ", "BS 30.6%   ", "BL 19.5%   ", 
    "BL 19.7%   ", "SH 19.4%   ", "SH 23.7%   ", "AR 33.5%   ", 
    "AR 36.7%   ", "AI 44.5%   ", "AI 51.1%   ", "SG 24.4%   ", 
    "SG 28.3%   ", "GR 32.7%   ", "GR 38%   ", "AG 25.4%   ", 
    "AG 30.2%   ", "TG 21.3%   ", "TG 26.3%   ", "TI 16.7%   ", 
    "TI 20.7%   ", "VD 12.1%   ", "VD 16%   ", "VS 21.5%   ", 
    "VS 26.3%   ", "NE 12.6%   ", "NE 14.6%   ", "GE 3.3%   ", 
    "GE 6.1%   ", "JU 23%   ", "JU 27.7%   "), hjust = c(1.2, 
    0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 
    1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 
    0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 
    1.2, 0, 1.2, 0, 1.2, 0)), .Names = c("Kanton", "Jahr", "Verhältnis", 
"GDEKT", "Verhältnis_label", "Kanton_label", "hjust"), class = c("tbl_df", 
"tbl", "data.frame"), row.names = c(NA, -52L))

使用该数据，我将使用ggplot2 生成以下点图。

代码：

p <- ggplot(dotplot_data) +
  geom_path_interactive(aes(x = Verhältnis, y = Kanton, group = Kanton), colour = "#AAAAAA"
            # arrow = arrow(length = unit(0.2, "cm"), type = "closed")
            ) +
  geom_point(aes(x = Verhältnis, y = Kanton, colour = Jahr)) +
  geom_text(data = subset(dotplot_data, Jahr == 2015),
            aes(x = Verhältnis, y = Kanton, label = Verhältnis_label),  
            hjust = 0, colour = "#555555", size = 4) +
  geom_text(data = subset(dotplot_data, Jahr == 2009), 
            aes(x = Verhältnis, y = Kanton, label = Kanton_label),
            hjust = 1, colour = "#555555", size = 4) +
  scale_x_continuous(labels = percent, limits = c(-.05,.6)) +
  scale_colour_discrete(guide = F) +
  labs(x = NULL,
    y = NULL,
   title = "Anteil umweltfreundlicher Heizungen",
   subtitle = "2009, 2015",
   caption = "") +
  xlim(c(-.05, .6)) + 
  theme_minimal(
    # axis.text = element_blank(),
    # axis.ticks = element_blank()
  )
ggsave(p, filename = "output/dotplot.png", width = 7, height = 5)

现在我想将该图表保存为（响应式）HTML，这样我就可以在桌面设备和移动设备上都包含它（它会水平收缩）。 我遇到了plotly 包，因为它生成的绘图会自动调整大小（但不是 1:1，例如在ggiraph 中）。

实际上，我只是将它用于此目的。我不知道这是否是最好的工具，或者是否有更好的解决方案。也让我感到厌烦的是每个绘图都附带的相当大的库 src 文件 (~2MB)。

总之，代码如下：

ply <- ggplotly(p, collaborate = F, doubleClick = F, displayModeBar = F)
plotly::config(ply, collaborate = F, doubleClick = F, displayModeBar = F)
saveWidget(ply, "test.html", libdir = "src", selfcontained = F)

这样，我得到了一个响应式但有工具提示和右上角那个丑陋的栏的绘图 html 文件，我想知道我是否不能禁用绘图的所有交互功能。如您所见，我已经尝试使用一些配置选项，但不知何故它们不起作用，或者我使用它们的方式错误。

非常感谢任何方向 - 也包括其他包或工作流程 - 非常感谢。

【问题讨论】：

    标签： r ggplot2 plotly htmlwidgets


    【解决方案1】：

    在 Plotly 中禁用图例切换当前是 not possible，但您可以手动进行。

    prependContent(htmltools::tags$style('
.plot-container .legend .traces .legendtoggle {display: none;}
.plot-container .legend .traces .legendtext {cursor: default;}'))

    您获得了 plotly::config 调用权，但需要将其分配给 plotly 对象才能保存更改。

    ply <- plotly::config(ply, collaborate = F, doubleClick = F, displayModeBar = F)

    出于美观的原因，让我们将标签远离线条，并删除无用的hoverinfo

    ply[['x']][['data']][[5]][['x']] <- ply[['x']][['data']][[5]][['x']] - 0.05
ply[['x']][['data']][[4]][['x']] <- ply[['x']][['data']][[4]][['x']] + 0.05
ply[['x']][['data']][[4]][['hoverinfo']] <- 'none'
ply[['x']][['data']][[5]][['hoverinfo']] <- 'none'

    关于 Plotly Javascript 库的大小，您可以指向 https://cdn.plot.ly/plotly-latest.min.js 而不是自己提供它，希望其中一位用户访问过之前使用 Plotly 的网站，并且浏览器仍然在缓存中。

    library(plotly)
library(ggiraph)
library(htmlwidgets)

dotplot_data <- structure(list(Kanton = structure(c(8L, 8L, 13L, 13L, 18L, 18L, 
                                    25L, 25L, 17L, 17L, 24L, 24L, 20L, 20L, 19L, 19L, 5L, 5L, 22L, 
                                    22L, 7L, 7L, 16L, 16L, 4L, 4L, 9L, 9L, 21L, 21L, 26L, 26L, 14L, 
                                    14L, 23L, 23L, 15L, 15L, 11L, 11L, 6L, 6L, 3L, 3L, 10L, 10L, 
                                    2L, 2L, 1L, 1L, 12L, 12L), .Label = c("GE", "NE", "VD", "BL", 
                                                                          "ZG", "TI", "SO", "ZH", "SH", "VS", "TG", "JU", "BE", "SG", "AG", 
                                                                          "BS", "SZ", "LU", "GL", "NW", "AR", "FR", "GR", "OW", "UR", "AI"
                                    ), class = "factor"), Jahr = structure(c(1L, 7L, 1L, 7L, 1L, 
                                                                             7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 
                                                                             7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 
                                                                             7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L, 1L, 7L), .Label = c("2009", 
                                                                                                                                                     "2010", "2011", "2012", "2013", "2014", "2015"), class = "factor"), 
               Verhältnis = c(0.18245716727989, 0.234567735045611, 0.24932014665891, 
                              0.282991259307219, 0.291667314781689, 0.34810778972169, 0.434262510974539, 
                              0.47438822065533, 0.290624277074589, 0.333502152443657, 0.405097486492835, 
                              0.444295001120825, 0.318638617178079, 0.366800362271963, 
                              0.344886447973876, 0.366559250036619, 0.158794683184927, 
                              0.200541172129635, 0.310803517571986, 0.373802102210946, 
                              0.17589414669752, 0.223276715892796, 0.29494992542084, 0.306316282635547, 
                              0.194661570513323, 0.197384284340806, 0.193617140613607, 
                              0.236622748050551, 0.33538817183587, 0.367132867132867, 0.444847450394709, 
                              0.511295616914462, 0.243694965319972, 0.283000330472218, 
                              0.326857179802159, 0.380211750671041, 0.253870012888241, 
                              0.301849570094465, 0.213009063138175, 0.262879934417959, 
                              0.166988156513917, 0.20723066336873, 0.121289379668724, 0.160165035560148, 
                              0.214926378302262, 0.262849338486695, 0.125824437342762, 
                              0.145818371743814, 0.0331743010407139, 0.0607599044903447, 
                              0.229837043837503, 0.277344272528649), GDEKT = c("ZH", "ZH", 
                                                                               "BE", "BE", "LU", "LU", "UR", "UR", "SZ", "SZ", "OW", "OW", 
                                                                               "NW", "NW", "GL", "GL", "ZG", "ZG", "FR", "FR", "SO", "SO", 
                                                                               "BS", "BS", "BL", "BL", "SH", "SH", "AR", "AR", "AI", "AI", 
                                                                               "SG", "SG", "GR", "GR", "AG", "AG", "TG", "TG", "TI", "TI", 
                                                                               "VD", "VD", "VS", "VS", "NE", "NE", "GE", "GE", "JU", "JU"
                              ), Verhältnis_label = c("   18.2%", "   23.5%", "   24.9%", 
                                                      "   28.3%", "   29.2%", "   34.8%", "   43.4%", "   47.4%", 
                                                      "   29.1%", "   33.4%", "   40.5%", "   44.4%", "   31.9%", 
                                                      "   36.7%", "   34.5%", "   36.7%", "   15.9%", "   20.1%", 
                                                      "   31.1%", "   37.4%", "   17.6%", "   22.3%", "   29.5%", 
                                                      "   30.6%", "   19.5%", "   19.7%", "   19.4%", "   23.7%", 
                                                      "   33.5%", "   36.7%", "   44.5%", "   51.1%", "   24.4%", 
                                                      "   28.3%", "   32.7%", "   38%", "   25.4%", "   30.2%", 
                                                      "   21.3%", "   26.3%", "   16.7%", "   20.7%", "   12.1%", 
                                                      "   16%", "   21.5%", "   26.3%", "   12.6%", "   14.6%", 
                                                      "   3.3%", "   6.1%", "   23%", "   27.7%"), Kanton_label = c("ZH 18.2%   ", 
                                                                                                                    "ZH 23.5%   ", "BE 24.9%   ", "BE 28.3%   ", "LU 29.2%   ", 
                                                                                                                    "LU 34.8%   ", "UR 43.4%   ", "UR 47.4%   ", "SZ 29.1%   ", 
                                                                                                                    "SZ 33.4%   ", "OW 40.5%   ", "OW 44.4%   ", "NW 31.9%   ", 
                                                                                                                    "NW 36.7%   ", "GL 34.5%   ", "GL 36.7%   ", "ZG 15.9%   ", 
                                                                                                                    "ZG 20.1%   ", "FR 31.1%   ", "FR 37.4%   ", "SO 17.6%   ", 
                                                                                                                    "SO 22.3%   ", "BS 29.5%   ", "BS 30.6%   ", "BL 19.5%   ", 
                                                                                                                    "BL 19.7%   ", "SH 19.4%   ", "SH 23.7%   ", "AR 33.5%   ", 
                                                                                                                    "AR 36.7%   ", "AI 44.5%   ", "AI 51.1%   ", "SG 24.4%   ", 
                                                                                                                    "SG 28.3%   ", "GR 32.7%   ", "GR 38%   ", "AG 25.4%   ", 
                                                                                                                    "AG 30.2%   ", "TG 21.3%   ", "TG 26.3%   ", "TI 16.7%   ", 
                                                                                                                    "TI 20.7%   ", "VD 12.1%   ", "VD 16%   ", "VS 21.5%   ", 
                                                                                                                    "VS 26.3%   ", "NE 12.6%   ", "NE 14.6%   ", "GE 3.3%   ", 
                                                                                                                    "GE 6.1%   ", "JU 23%   ", "JU 27.7%   "), hjust = c(1.2, 
                                                                                                                                                                         0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 
                                                                                                                                                                         1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 
                                                                                                                                                                         0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 1.2, 0, 
                                                                                                                                                                         1.2, 0, 1.2, 0, 1.2, 0)), .Names = c("Kanton", "Jahr", "Verhältnis", 
                                                                                                                                                                                                              "GDEKT", "Verhältnis_label", "Kanton_label", "hjust"), class = c("tbl_df", 
                                                                                                                                                                                                                                                                               "tbl", "data.frame"), row.names = c(NA, -52L))


p <- ggplot(dotplot_data) +
  geom_path_interactive(aes(x = Verhältnis, y = Kanton, group = Kanton), colour = "#AAAAAA"
                        # arrow = arrow(length = unit(0.2, "cm"), type = "closed")
  ) +
  geom_point(aes(x = Verhältnis, y = Kanton, colour = Jahr)) +
  geom_text(data = subset(dotplot_data, Jahr == 2015),
            aes(x = Verhältnis, y = Kanton, label = Verhältnis_label),  
            hjust = 0, colour = "#555555", size = 4) +
  geom_text(data = subset(dotplot_data, Jahr == 2009), 
            aes(x = Verhältnis, y = Kanton, label = Kanton_label),
            hjust = 1, colour = "#555555", size = 4) +
  scale_x_continuous(labels = percent, limits = c(-.05,.6)) +
  scale_colour_discrete(guide = F) +
  labs(x = NULL,
       y = NULL,
       title = "Anteil umweltfreundlicher Heizungen",
       subtitle = "2009, 2015",
       caption = "") +
  xlim(c(-.05, .6)) + 
  theme_minimal(
    # axis.text = element_blank(),
    # axis.ticks = element_blank()
  )
p
ply <- ggplotly(p) %>% 
prependContent(htmltools::tags$style('
.plot-container .legend .traces .legendtoggle {display: none;}
.plot-container .legend .traces .legendtext {cursor: default;}')
               )
ply <- plotly::config(ply, collaborate = F, doubleClick = F, displayModeBar = F)
ply[['x']][['data']][[5]][['x']] <- ply[['x']][['data']][[5]][['x']] - 0.05
ply[['x']][['data']][[4]][['x']] <- ply[['x']][['data']][[4]][['x']] + 0.05
ply[['x']][['data']][[4]][['hoverinfo']] <- 'none'
ply[['x']][['data']][[5]][['hoverinfo']] <- 'none'
ply
saveWidget(ply, "test.html", libdir = "src", selfcontained = F)

    【讨论】：

    • 非常感谢，我已经初步了解了它，看起来很有希望。我现在唯一的问题是标签的定位（路径的左侧和右侧）没有响应。当我将宽度缩小到 320 像素（iPhone 4/5）时，标签会重叠。是否有“断点”之类的可能性？或者指定百分比值而不是0.05？
    • 我不知道直接在 Plotly 中执行此操作的任何可能性，但也许使用一点 JavaScript 应该是可行的。也许将其作为一个单独的问题发布？
    猜你喜欢
    • 2022-12-16
    • 2022-12-08
    • 2021-10-19
    • 2020-12-01
    • 2021-03-24
    • 2023-03-07
    • 1970-01-01
    • 1970-01-01
    • 2020-06-18
    相关资源
    最近更新 更多
    热门标签
    Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode