# Annotation with Dash/plotly for R

**URL:** <https://community.plotly.com/t/annotation-with-dash-plotly-for-r/28245>\
**Category:** Dash Python\
**Created:** [September 5, 2019, 12:51pm UTC](https://community.plotly.com/t/annotation-with-dash-plotly-for-r/28245 "2019-09-05T12:51:49Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![cbenner](https://avatars.discourse-cdn.com/v4/letter/c/e19b73/32.png) [@cbenner](https://community.plotly.com/u/cbenner)\
**Post date:** [September 5, 2019, 12:51pm UTC](https://community.plotly.com/t/annotation-with-dash-plotly-for-r/28245/1 "2019-09-05T12:51:50Z")

</div>

I am trying to add a text annotation to a Dash/plotly plot. Take for example the code below from [https://dashr.plot.ly/getting-started-part-2](https://dashr.plot.ly/getting-started-part-2). Could someone please help me add a text annnotation to one of the data points?

```
library(dash)
library(dashCoreComponents)
library(dashHtmlComponents)

app <- Dash$new()

df <- read.csv(
  file = "https://raw.githubusercontent.com/plotly/datasets/master/gapminderDataFiveYear.csv",
  stringsAsFactor=FALSE,
  check.names=FALSE
)

continents <- unique(df$continent)
years <- unique(df$year)

# dccSlider starts from 0;
app$layout(
  htmlDiv(
    list(
      dccGraph(id = 'graph-with-slider'),
      dccSlider(
        id = 'year-slider',
        min = 0,
        max = length(years) - 1,
        marks = years,
        value = 0
      )
    )
  )
)

app$callback(
  output = list(id='graph-with-slider', property='figure'),
  params = list(input(id='year-slider', property='value')),

  function(selected_year_index) {

    which_year_is_selected <- which(df$year == years[selected_year_index + 1])

    traces <- lapply(continents,
                     function(cont) {

                       which_continent_is_selected <- which(df$continent == cont)

                       df_sub <- df[intersect(which_year_is_selected, which_continent_is_selected),]

                       with(
                         df_sub, 
                         list(
                           x = gdpPercap,
                           y = lifeExp,
                           opacity=0.5,
                           text = country,
                           mode = 'markers',
                           marker = list(
                             size = 15,
                             line = list(width = 0.5, color = 'white')
                           ),
                           name = cont
                         )
                       )
                     }
    )

    list(
      data = traces,
      layout= list(
        xaxis = list(type = 'log', title = 'GDP Per Capita'),
        yaxis = list(title = 'Life Expectancy', range = c(20,90)),
        margin = list(l = 40, b = 40, t = 10, r = 10),
        legend = list(x = 0, y = 1),
        hovermode = 'closest'
      )
    )
  }
)

#app$run_server()
```

---

<div class="post-metadata">

**Author:** ![rpkyle](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/rpkyle/32/7248_2.png) [@rpkyle](https://community.plotly.com/u/rpkyle)\
**Post date:** [September 7, 2019, 1:46am UTC](https://community.plotly.com/t/annotation-with-dash-plotly-for-r/28245/2 "2019-09-07T01:46:40Z")

</div>

Hi cbenner,

Here’s an example adapted from [https://github.com/plotly/dash-recipes/blob/master/dash-annotations.py](https://github.com/plotly/dash-recipes/blob/master/dash-annotations.py):

```
library(dash)
library(dashHtmlComponents)
library(dashCoreComponents)

app <- Dash$new()

gdp <- list(
  list(x = list(2012, 2013, 2014, 2015, 2016),
       y = list(103.5, 101.3, 100.7, 97.2, 99.8))
)

make_annotation_item <- function(x, y, label, arrow) {
  return(list(
    xref = 'x',
    yref = 'y',
    x = x, 
    y = y,
    font = list(color = 'black'),
    xanchor = 'left',
    yanchor = 'middle',
    text = label,
    showarrow = arrow,
    arrowhead = 7
  ))
}

annotated_point <- list(make_annotation_item(x = 2016, 
                                             y = 99.8, 
                                             label = "Label goes here", 
                                             arrow = TRUE))

app$layout(htmlDiv(children=list(
  dccGraph(
    id='example-graph',
    figure=list(
      data = gdp,
      layout = list(
        'xaxis' = list(range=list(2010, 2018)),
        'annotations' = annotated_point
        )   
      )   
    )   
   )
  )
)

app$run_server()

```

Hope this helps!

Cheers,  
Ryan