使用Highcharts在每个柱状图上添加水平线

Question

这是我的代码：

data <- gapminder::gapminder %>% filter(country == 'Brazil') %>%
  mutate(life = rnorm(12,mean = 55,sd = 5),
         months = month.abb)   

这是我的图表：

 data%>%
      mutate(months = as_factor(months)) %>%
      mutate(index = rep(c(1,2),6), .before = everything()) %>%

      hchart(
        'column',
        names = 'SQUADS',
        hcaes(x = months,
              y = lifeExp,
              group = months),

        color = rep(c('#1B3D59','lightgray'),6),

        name = 'Sales',
        # groupPadding = 1.5,
        pointWidth = 20,
        showInLegend = FALSE
      )

我想在代表“life”列的每个柱状图上添加水平线“--”，以实现以下效果：

- Laura

Answer 1

我认为最简单的方法是使用errorbars。基本上，你会将低值和高值设为相同的数值，从而创建出线段。

我在你的代码中添加了一个参数用于column图表。你需要使用centerInCategory，否则柱状图与误差线不会对齐。除了这个额外的参数之外，你原来的代码与问题中的代码是一样的。

在编写新系列时，我使用life作为线段的位置。此外，你在column中添加的任何间距规格也必须添加到errorbar中。

如果你有任何问题，请告诉我。

library(highcharter)
library(tidyverse)

data <- gapminder::gapminder %>% filter(country == 'Brazil') %>%
  mutate(life = rnorm(12, mean = 55,sd = 5),
         months = month.abb)

data %>%
  mutate(months = as_factor(months)) %>%
  mutate(index = rep(c(1,2), 6), .before = everything()) %>%
  
  hchart('column',
         names = 'SQUADS', name = 'Sales', 
         hcaes(x = months, y = lifeExp, group = months),
         color = rep(c('#1B3D59','lightgray'), 6),
         pointWidth = 20, showInLegend = FALSE,
         centerInCategory = T) %>%                   # <--- I added this!
  hc_add_series(data, "errorbar",
                hcaes(x = months, y = life, low = life, high = life, 
                      group = months),
                pointWidth = 20, whiskerLength = 20, # widths set match column
                centerInCategory = T, showInLegend = F)

- Kat

Answer 2

@Kat的解决方案在各个方面都更简单，可能是正确的方法。

以下是我尝试的方式，我认为它提供了更多的灵活性。我设置了一个自定义符号用于标记。然后添加了一个线系列，其中lineWidth = 0，这样只显示标记。以这种方式进行操作对工具提示更友好。此外，要使柱形居中，您可以使用groupPadding = .5。在JS加载函数中，我需要在图表渲染后手动更新符号。

如果您有任何问题，请告诉我！

library(highcharter)
library(dplyr)

data = data %>%
  mutate(months = as.factor(months)) %>%
  mutate(index = rep(c(1,2),6), .before = everything())

highchart(type = "chart") %>%
  hc_xAxis(type = "categories", categories = unique(data2$months)) %>%
  hc_add_series(data, hcaes(x = months, y = lifeExp), type = "column", name = 'Sales',
    groupPadding = .5, 
    pointWidth = 20, 
    showInLegend = FALSE
  ) %>%
  hc_add_series(data, hcaes(x = months, y = life), type = "line", name = "Life",
    lineWidth = 0, states = list(hover = list(lineWidthPlus = 0)),
    showInLegend = FALSE
  ) %>%
  hc_plotOptions(
    line = list(
      marker = list(
        symbol = 'line', 
        lineWidth = 3,
        radius = 12, 
        lineColor = "#000")
      ),
    column = list(
      colorByPoint = TRUE,
      colors = rep(c("#4f8ec2",'lightgray'), 6) 
    )
    ) %>%
  hc_chart(
    events = list(
      load = JS("function(){
        Highcharts.SVGRenderer.prototype.symbols.line = function(x, y, w, h) {
                  return ['M',x ,y + w / 2,'L',x+h,y + w / 2];
        };
        this.series[1].update({marker: {symbol: 'line'}})
      }")
    )
  )

- Jamie