在 plotly 图表中添加水平滚动条答案

【问题标题】：Add horizontal scroll bar in plotly chart在 plotly 图表中添加水平滚动条
【发布时间】：2021-04-27 19:16:07
【问题描述】：

如何在长曲线图中添加水平 x 轴滚动条？

library(plotly)

x <- c(1:100)
random_y <- rnorm(100, mean = 0)
data <- data.frame(x, random_y)

fig <- plot_ly(data, x = ~x, y = ~random_y, type = 'scatter', mode = 'lines')

fig

rangeslider() 不起作用的情况。

VaccinationWeek<-c("2020w1","2020w1","2020w1","2020w2","2020w2","2020w2")
Country<-c("EU","CHE","ITA","EU","CHE","ITA")
Value<-c(3,2,1,5,3,2)
dat<-data.frame(VaccinationWeek,Country,Value)
plot_ly(dat,
        x = ~VaccinationWeek, 
        y = ~Value/100,
        text = ~Value,
        color = ~Country,
        customdata = dat$Country) %>%
  add_trace(
    type = 'scatter',
    mode = 'lines+markers',
    hovertemplate = paste("Country: %{customdata}",
                          "Uptake full vaccination (%): %{y}", 
                          "<extra></extra>",
                          sep = "\n"),
    hoveron = 'points') %>%
  add_text(    
    textposition = "top center",
    showlegend = F,
    hoverinfo = "skip") %>% 
  layout(font = list(color = '#a2a2a2'),title=list(text="by reporting week",x = 0),
         xaxis = list(fixedrange = TRUE,title="",showgrid = FALSE,tickangle = 45
         ),
         yaxis = list(fixedrange = TRUE,rangeslider = list(),title="",showgrid = FALSE,showline=T,tickformat = "%"),
         hovermode = "x unified",
         hoverlabel = "none",
         legend = list(itemclick = F, itemdoubleclick = F))%>%
  config(modeBarButtonsToRemove = c('toImage',"zoom2d","toggleSpikelines","hoverClosestCartesian","hoverCompareCartesian","drawline","autoScale2d" ,"resetScale2d","zoomIn2d","zoomOut2d","pan2d",'select2d','lasso2d'))%>%
  config(displaylogo = FALSE)

【问题讨论】：

标签： r plotly r-plotly

【解决方案1】：

我建议使用rangeslider:

library(plotly)

x <- c(1:100)
random_y <- rnorm(100, mean = 0)
data <- data.frame(x, random_y)

fig <- plot_ly(data, x = ~x, y = ~random_y, type = 'scatter', mode = 'lines') %>%
  layout(xaxis = list(rangeslider = list()))

fig

@firmo23 编辑后：

library(plotly)

VaccinationWeek <- c("2020w1", "2020w1", "2020w1", "2020w2", "2020w2", "2020w2")
Country <- c("EU", "CHE", "ITA", "EU", "CHE", "ITA")
Value <- c(3, 2, 1, 5, 3, 2)
dat <- data.frame(VaccinationWeek, Country, Value)
plot_ly(
  dat, x = ~ VaccinationWeek, y = ~ Value / 100, text = ~ Value, color = ~ Country, customdata = dat$Country
) %>%
  add_trace(
    type = 'scatter', mode = 'lines+markers', hovertemplate = paste(
      "Country: %{customdata}", "Uptake full vaccination (%): %{y}", "<extra></extra>", sep = "\n"
    ), hoveron = 'points'
  ) %>%
  add_text(textposition = "top center", showlegend = F, hoverinfo = "skip") %>%
  layout(
    font = list(color = '#a2a2a2'), title = list(text = "by reporting week", x = 0), xaxis = list(
      fixedrange = TRUE, title = "", showgrid = FALSE, tickangle = 45, rangeslider = list()
    ), yaxis = list(
      fixedrange = TRUE, rangeslider = list(), title = "", showgrid = FALSE, showline = T, tickformat = "%"
    ), hovermode = "x unified", hoverlabel = "none", legend = list(itemclick = F, itemdoubleclick = F)
  ) %>%
  config(
    modeBarButtonsToRemove = c(
      'toImage',
      "zoom2d",
      "toggleSpikelines",
      "hoverClosestCartesian",
      "hoverCompareCartesian",
      "drawline",
      "autoScale2d" ,
      "resetScale2d",
      "zoomIn2d",
      "zoomOut2d",
      "pan2d",
      'select2d',
      'lasso2d'
    ),
    displaylogo = FALSE
  )

【讨论】：

我喜欢您的建议，但为什么它在编辑后的示例中不起作用？
@firmo23 对我来说，它适用于您提供的第二个示例。请检查我的编辑。