Highcharts in R: sort xAxis in Line Chart - r

I have a simple line chart, but some categories do not have all periods (xAxis), so the xAxis is not ordered at the end.
That is an example data:
The chart looks like that (with "2019-01" and "2019-03" exchanged)
Example Code
df <- data.frame(PERIODO = c("2017-01","2017-03","2018-01","2018-03",
"2018-03","2019-01",rep("2019-03",2),
"2020-01"),
CATEGORIA = c(rep("A",4),rep("B",2),"A","B","B"),
FRECUENCIA = c(2,3,3,1,2,4,1,1,2))
highchart() %>%
hc_xAxis(type = "category") %>%
hc_add_series(df, "line",
hcaes(x = PERIODO, y = FRECUENCIA,
group = CATEGORIA),
dataLabels = list(enabled = TRUE,
style = list(fontSize = '13px'))
) %>%
hc_legend(enabled = TRUE, align = "right",layout = 'vertical',verticalAlign= "middle") %>%
hc_tooltip(shared = TRUE, crosshairs = TRUE
,style = list(fontSize = "18px")
Someone knows about how to keep the xAxis order by PERIODO: 2017-01,2017-03,2018-01,2018-03,2019-01,2019-03,2020-01

Perhaps you can put your dates PERIODO in Date format (use first day of the month if you only have months).
df$PERIODO <- as.Date(paste0(df$PERIODO, "-01"))
Then, use type = "datetime" instead of category for your hc_xAxis argument. You can indicate what you want as labels on your x-axis using dateTimeLabelFormats.
highchart() %>%
hc_xAxis(type = "datetime",
dateTimeLabelFormats = list(month = '%b %Y')) %>%
...
Default labels and more information can be found here.

Related

Highcharter format number in tooltip

I'm using Highcharts in R, and I want to format the number in the tooltip as a currency without decimal spaces. Right now, numbers appear like this: 34 537 987.21. I want that number to look like this: $34,537,987. Or, better yet, like this: $34M.
Here's a sample of my code:
highchart() %>%
hc_add_series(df,
type = 'spline',
hcaes(x = year, y = data)
) %>%
hc_add_series(df,
type = 'spline',
hcaes(x = year, y = other_data)
) %>%
hc_plotOptions(series = list(marker = list(enabled = TRUE,
hover = TRUE,
symbol = 'circle'))
) %>%
hc_tooltip(
shared = TRUE,
crosshairs = TRUE
)
Use the tooltip parameter inside hc_ad_series() and define as shown below.
highchart() %>%
hc_add_series(df,
type = 'spline',
hcaes(x = year, y = data),
tooltip = list(pointFormat = "$ {point.data}")
) %>%
hc_add_series(df,
type = 'spline',
hcaes(x = year, y = other_data),
tooltip = list(pointFormat = "$ {point.other_data}")
) %>%
hc_plotOptions(series = list(marker = list(enabled = TRUE,
hover = TRUE,
symbol = 'circle'))
)
Hope it helps.

R programming Highchart Number format

I am trying to draw line chart using Highchart . I need data format in Million format . Ex for the First point in screenshot 2423175 should be shown as 2.42 Million .How do i change format = "{point.y}" to show in Millions
highchart() %>%
hc_add_series(data, hcaes(x = data$Month, y = data$Total, color = data$Total), type = "line",dataLabels = list(
enabled = TRUE,
format = "{point.y} " )
) %>%
hc_tooltip(cros[![enter image description here][1]][1]shairs = TRUE, borderWidth = 1.5,headerFormat= "",
pointFormat = paste("Year: <b>{point.x:%b-%y}</b> <br> Population: <b>{point.y}</b>")) %>%
hc_title(text = "Population by year") %>%
hc_subtitle(text = "2016-2020") %>%
hc_xAxis(type = "datetime", title = list(text = "Year")) %>%
hc_yAxis(title = list(text = "count per year")) %>%
hc_legend(enabled = FALSE) %>%
hc_add_theme(custom_theme)
Here is a 2 step way of doing it:
First, you need to format your numbers from looking like 2423175 to 2.42 before you create your plot.
data$Total <- format(round(data$Total / 1e6, 1), trim = TRUE)
Next, in order to add 'Million' after your numbers in Highcharter, change format from format = "{point.y} " to format = paste("{point.y} Million") while creating your plot. Your numbers should now be displayed in the format "X.XX Million".
You can use dataLabels.formatter: https://api.highcharts.com/highcharts/series.line.dataLabels.formatter to format your dataLabels. I know how to do it in JavaScript and inject this code inside JS() function in R:
hc_add_series(data, hcaes(x = data$Month, y = data$Total, color = data$Total), type = "line",dataLabels = list(
enabled = TRUE,
formatter = JS("function() {
return (this.y / 1000000).toFixed(2) + 'M'
}") )
) %>%
JS example: https://jsfiddle.net/BlackLabel/o49zcjLv
Let me know if it worked.
Edit: The whole working code with sample data:
library(highcharter)
data <- data.frame(
y = c(54324232,85325324,10424324,44234324,74324234, 44321413))
highchart() %>%
hc_add_series(data, type = "line", hcaes(y = y), dataLabels = list(
enabled = TRUE,
formatter = JS("function() {
return (this.y / 1000000).toFixed(2) + 'M'
}"
)))

Formatting datetime in Highcharter tooltip

Looking to change the format of the datetime in the tooltip. I successfully did it for the x-axis but have not for the tooltip. I've read the docs and cannot find another R-specific topic on this.
Dates are in the required Highchart timestamp from the datetime_to_timestamp function.
library(highcharter)
library(tidyverse)
df <- data.frame(dateTime = c(1557705900000,1557705960000,1557706020000,1557706860000,1557706920000),
points = c(5,7,3,2,9))
highchart() %>%
hc_xAxis(type = "datetime", dateTimeLabelFormats = list(day = '%H:%M')) %>%
hc_add_series(df, type = "scatter",
hcaes(x = dateTime, y = points)) %>%
hc_tooltip(crosshairs = TRUE, dateTimeLabelFormats = list(day = '%H:%M'))
# highchart() %>%
# hc_xAxis(type = "datetime", dateTimeLabelFormats = list(day = '%H:%M')) %>%
# hc_add_series(df, type = "scatter",
# hcaes(x = dateTime, y = points)) %>%
# hc_tooltip(crosshairs = TRUE, dateTimeLabelFormats = '%H:%M')
The tooltip format should look like the x-axis format.
Any thoughts?
Try pointFormat.
highchart() %>%
hc_xAxis(type = "datetime", dateTimeLabelFormats = list(day = '%H:%M')) %>%
hc_add_series(df, type = "scatter",
hcaes(x = dateTime, y = points)) %>%
hc_tooltip(crosshairs = TRUE, pointFormat = "x: {point.x:%H:%M} <br> y: {point.y}")

Bar with negative stack and positive labels

I'm trying to make in R (Shiny) a reversed stacked bar highchart. I already found how to make the graph, but I can't find out how to make the labels on the x-axis positive, like here: https://www.highcharts.com/demo/bar-negative-stack
I've tried to apply the abs() function, but it didn't work so far. Does anyone have a solution?
highchart() %>%
hc_chart(type = "bar") %>%
hc_title(text = "Example") %>%
hc_yAxis(title = list(text = ""), labels = list(format = "{value}")) %>%
hc_plotOptions(series=list(stacking='normal'),
column = list( dataLabels = list(enabled = FALSE),
enableMouseTracking = TRUE)) %>%
hc_legend(enabled = FALSE) %>%
hc_xAxis(reversed=FALSE, opposite=TRUE, reversed=FALSE) %>%
hc_add_series(name="neutral", id='neutral', color=c("#766A62"), data=list(2, 8)) %>%
hc_add_series(name="Neutral",linkedTo='neutral',color=c("#ffeeff"),data=list(-5, -3))
I want the values of the bars and the labels on the x-axis all to be positive. Any ideas welcome.
Using your code:
highchart() %>%
hc_chart(type = "bar") %>%
hc_title(text = "Example") %>%
hc_yAxis(title = list(text = ""),labels = list(format = "{value}")) %>%
hc_plotOptions(series=list(stacking='normal'),column = list( dataLabels = list(enabled = FALSE),
enableMouseTracking = TRUE)) %>%
hc_legend(enabled = FALSE) %>%
hc_xAxis(list(categories = c("0-4", "5-9"),
reversed=FALSE ),
list(reversed=FALSE,opposite=TRUE,
reversed=FALSE,
categories =c("0-4", "5-9"),
linkedTo = 0)) %>%
hc_yAxis(
labels = list(
formatter = JS("function(){ return Math.abs(this.value) + '%'; }"))) %>%
hc_add_series(name="neutral",id='neutral',color=c("#766A62"),data=list(2, 8)) %>%
hc_add_series(name="Neutral",linkedTo='neutral',color=c("#ffeeff"),data=list(-5, -3))
Following lines are modified:
hc_xAxis(list(categories = c("0-4", "5-9"),
reversed=FALSE ),
list(reversed=FALSE,opposite=TRUE,
reversed=FALSE,
categories =c("0-4", "5-9"),
linkedTo = 0)) %>%
hc_yAxis(
labels = list(
formatter = JS("function(){ return Math.abs(this.value) + '%'; }")))
Result:

highcharter hc_axis not working correctly

Follow up on this post I am not able to get the x-axis labels in correct format using the code below.
hchart(visits, "column", x = as.Date(VisitDate), y = freq, group = Clinic) %>%
hc_xAxis(categories = allDates$VisitDate, title = list(text = 'Deadline'), type = 'datetime', dateTimeLabelFormats = list(month = "%b", year = "%y")) %>%
hc_plotOptions(column = list(
dataLabels = list(enabled = FALSE),
stacking = "normal",
enableMouseTracking = TRUE)
)
The resulting chart below has labels all messed up.
Also is it possible to specify interval as in 1 month, 15 days etc.
hchart(visits, "column", hcaes(x = VisitDate, y = freq, group = Clinic)) %>%
hc_xAxis(categories = allDates$VisitDate, title = list(text = 'Deadline'), type = 'datetime', dateTimeLabelFormats = list(month = "%b", year = "%y")) %>%
hc_plotOptions(column = list(
dataLabels = list(enabled = FALSE),
stacking = "normal",
enableMouseTracking = TRUE)
)
You need to add hcaes inside the hchart function. There are some nice examples here Highcharter page
Also Highchart prefer dates as timestamp to work the way you want, please check this answer plotband.
I hope this help you. Have a nice day
edit1:
With this code you can add the select range to date you want, however I think to this kind of data and chart it does not apply
hchart(visits, "column", hcaes(x = VisitDate, y = freq, group = Clinic))%>%
hc_xAxis(categories = allDates$VisitDate, title = list(text = 'Deadline'),
type = 'datetime', dateTimeLabelFormats = list(month = "%b", year = "%y"))
%>%
hc_plotOptions(column = list(
dataLabels = list(enabled = FALSE),
stacking = "normal",
enableMouseTracking = TRUE)
) %>%
hc_rangeSelector(enabled = TRUE, buttons = list(
list(type = "all", text = "All"),
list(type = "month", count = 1, text = "1m"),
list(type = "day", count = 15, text = "15d"),
list(type = "day", count = 1, text = "1d")
), selected = 3)

Resources