How to configure thousand separator for hovertext in R plotly?

Question

It looks like a simple task, but after hours looking aroung I'm not able to find a suitable solution. I'm using plotly to plot line and bar charts, and I have trouble formatting hover numbers. I want the following :

decimal separator ','
thousand separator ' '

I'm able to setup the decimal separator by setting the locale to FR. I'm also able to get space separator for the ticklabeld. However I'm not able at all to add space as thousand separator.

I would like to find an elegant solution by setting hovertemplate = '%{x} | %{y:.0f}' , but any other solution would fit.

This is the code for my plot :

data <- EMPL1019[,c(1,2,4)]
colnames(data) <- c('Date','Salaries','Equivalent')

ticklabels <- seq(from=0, to=round(max(data$Salaries)), by=5000)
ticktexts <- c(0,paste(ticklabels[-1]/1000, " 000", sep=""))

EMP.g1 <- plot_ly(data = data,
              name = 'Salariés',
              line = list(color = ispfPalette[1]),
              x = ~Date,
              y = ~Salaries,
              hovertemplate = '%{x} | %{y:.0f}<extra></extra>',
              type = 'scatter',
              mode = 'line')
EMP.g1 <- EMP.g1 %>% add_trace(y = ~Equivalent,
                       hovertemplate = '%{x} - %{y:.2f}<extra></extra>',
                       name = 'Equ. temps plein',
                       line = list(color = ispfPalette[9]))
EMP.g1 <- EMP.g1 %>% layout(yaxis = list(separatethousands = T,tickformat = '.0f'))
EMP.g1 <- EMP.g1 %>% layout(yaxis=list(tickvals = ticklabels,
                                       ticktext = ticktexts))
EMP.g1 <- EMP.g1 %>% layout(yaxis = yaxis_template, 
                            xaxis = xaxis_template,
                            legend = list(orientation = 'h'))
EMP.g1 <- EMP.g1 %>% config(locale = 'fr')

And this is a sample of my data :

structure(list(Date = structure(c(1635724800, 1633046400, 1630454400, 
1627776000, 1625097600, 1622505600, 1619827200, 1617235200, 1614556800, 
1612137600, 1609459200, 1606780800, 1604188800, 1601510400, 1598918400, 
1596240000, 1593561600, 1590969600, 1588291200, 1585699200, 1583020800, 
1580515200, 1577836800, 1575158400), class = c("POSIXct", "POSIXt"
), tzone = "UTC"), `Nombre de salariés` = c(67124L, 66347L, 
65629L, 66937L, 66503L, 65780L, 64963L, 64820L, 64320L, 63978L, 
64320L, 65139L, 64726L, 64824L, 64349L, 64252L, 63802L, 63302L, 
60612L, 58449L, 66069L, 66680L, 66934L, 67530L), `Masse salariale` = structure(c(0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000938992338891789, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000909115204071465, 
0.000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000088773284923459, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000896660284134519, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000906967890625601, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000916330649236409, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000889642613151166, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000854022123447163, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000855530315648643, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000848916147880622, 
0.00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000008974157736486, 
0.000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000110317720806686, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000870705472791466, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000859874685909506, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000857318642824282, 
0.000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000085576196400845, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000840277121133498, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000843657217346959, 
0.000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000082555304014476, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000801471849889434, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000900019006376449, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000904107403400091, 
0.0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000979945565570618, 
0.000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000116166151318982
), class = "integer64"), `Effectif équivalent temps plein` = c(58126.7732710957, 
57206.3988279215, 55259.2352879171, 55479.1570677117, 56688.511680619, 
55841.9537494603, 54526.0767610181, 53368.5979797748, 53134.6513287857, 
52946.3782282233, 53251.3191244597, 54829.7587531314, 53915.6804815763, 
54306.2860265348, 54170.5949118788, 53649.4815305165, 52445.0726773908, 
51356.6072581076, 50193.6687158648, 48360.6793136537, 56294.0759669762, 
57709.3582162786, 57246.9744898572, 58543.1814151947)), class = c("data.table", 
"data.frame"), row.names = c(NA, -24L), .internal.selfref = <pointer: 0x000001d4019765b0>)

I can't trust that there is no easy way to do it. Even tickvals and ticktext solution looks overcomplex and I'm sure there is a better way to do it.

Thanks in advance for your help !

Only speaking to the comma issue (me and plotly are not simpatico yet), have you examined using label_comma() which is in the scales package (which is part of the tidyverse)? — John Garland, May 17 '22 at 01:48
Thanks a lot for the info. I will try that. However any hint for the thousand separator would be appreciated. I would like it formatted only when displayed into plotly (I don't want to update the dataset to a char string with space every 3 characters). — Benjamin BERNARD, May 17 '22 at 02:13
When I ran your code, I did get white space as the thousands separator which is what I think that you want. I did have to comment out the palettes and the axes' templates because I don't have them. Can you let me know if white space isn't what you're looking for? For example, 15 000 for fifteen thousand or quinze mille. — Kat, May 17 '22 at 03:33
Thanks for your help Kat. Indeed the space is there on the axis, but not on the hover label. Sorry for not being clear. — Benjamin BERNARD, May 17 '22 at 20:50
No big deal; I've got it now. Let me know if you have any questions. — Kat, May 18 '22 at 02:27

score 2 · Answer 1 · answered May 18 '22 at 02:26

It works, but it's not native Plotly. What I did was add the parameter hovertext, I then used this to format the values you used in y = Salaries and y = Equivalent. Then I replaced y in your hovertemplate with hovertext.

(I've only commented out the palettes because I don't have the data for these objects.)

EMP.g1 <- plot_ly(data = data,
                  name = 'Salariés',
                  line = list(color = 'darkred'), #ispfPalette[1]),
                  x = ~Date,
                  y = ~Salaries,
                  hovertext = ~formatC(Salaries, big.mark = " ",
                                       format = "d"),   # integer (no decimal)
                  hovertemplate = '%{x} | %{hovertext}<extra></extra>',
                  type = 'scatter',
                  mode = 'line')
EMP.g1 <- EMP.g1 %>% 
  add_trace(y = ~Equivalent,
            hovertext = ~formatC(Equivalent, 
                                 big.mark = " ", # space separator
                                 format = "d"),  # integer (no decimal)
            hovertemplate = '%{x} - %{hovertext}<extra></extra>',
            name = 'Equ. temps plein',
            line = list(color = 'black')) #ispfPalette[9]))

The rest of your code is unchanged.

Thanks again Kat. This works very fine with integer number. However, I tried to apply the same on float numbers and I get NaN instead of the value. I had a look to the formatC function, and so tried f and g instead of d as format, but f return also NaN and g does not include the spaces as required... — Benjamin BERNARD, May 18 '22 at 22:20
Just to make sure that we are talking about the same thing—you're referring to a number that isn't rounded to the nearest whole value. For example, if you were to round `Equivalent` to the 2 decimal places? If so, first, you would want to set the `small.mark = ","`, `digits = 2`, and `format = "f"` to have this reflect decimal values. It may be easier to follow when it's all together: `~formatC(Equivalent, digits = 2, big.mark = " ", decimal.mark = ",", format = "f")` — Kat, May 18 '22 at 22:51
Oooh okay ! Thanks a lot. Your answers are always very helpful. — Benjamin BERNARD, May 18 '22 at 23:11

How to configure thousand separator for hovertext in R plotly?

1 Answers1