1

Can we add hovertext or text annotation in a plotly gauge chart? For example in my plot below I want to add in the green area hover or text or both "Uptake first dose%: 19.8" and in the gray area "Not vaccinated (%):80.2"

library(plotly)

fig <- plot_ly(
  type = "indicator",
  mode = "gauge+number+delta",
  value = 19.8,
  title = list(text = "Uptake first dose %", font = list(size = 24)),
  delta = list(reference = 70, increasing = list(color = "gray")),
  gauge = list(
    axis = list(range = list(NULL, 100), tickwidth = 1, tickcolor = "lightgreen"),
    bar = list(color = "lightgreen"),
    bgcolor = "white",
    borderwidth = 2,
    bordercolor = "gray",
    steps = list(
      list(range = c(0, 50), color = "lightgreen"),
      list(range = c(20, 100), color = "gray")),
    threshold = list(
      line = list(color = "black", width = 4),
      thickness = 0.75,
      value = 70))) 
fig <- fig %>%
  layout(
    margin = list(l=20,r=30),
    paper_bgcolor = "lavender",
    font = list(color = "darkblue", family = "Arial"))

fig
firmo23
  • 7,490
  • 2
  • 38
  • 114

1 Answers1

1

You can add annotations but I couldn't find a way to get the hovertext without an annotation.

fig <- plotly::plot_ly(
  type = "indicator",
  mode = "gauge+number+delta",
  value = 19.8,
  title = list(text = "Uptake first dose %", font = list(size = 24)),
  delta = list(reference = 70, increasing = list(color = "gray")),
  gauge = list(
    axis = list(range = list(NULL, 100), tickwidth = 1, tickcolor = "lightgreen"),
    bar = list(color = "lightgreen"),
    bgcolor = "white",
    borderwidth = 2,
    bordercolor = "gray",
    steps = list(
      list(range = c(0, 50), color = "lightgreen"),
      list(range = c(20, 100), color = "gray")),
    threshold = list(
      line = list(color = "black", width = 4),
      thickness = 0.75,
      value = 70))) 
fig <- fig %>%
  plotly::layout(
    margin = list(l=20,r=30),
    paper_bgcolor = "lavender",
    font = list(color = "darkblue", family = "Arial"),
    annotations = list(x = 0.05, y = 0.3, text = "19.8%",
                       hovertext = "Your Text",
                       showarrow = FALSE))

fig

You could also use add_annotations if you want to add multiples. See https://plotly.com/r/text-and-annotations/

see24
  • 1,097
  • 10
  • 21