R Highcharter:格式化工具提示

时间:2018-06-28 18:30:10

标签: r highcharts r-highcharter

我有一个“堆积条形图”图表,将其放在较宽的条形图中,以查看它是否符合我的标准。由于一个技巧(使用grouping = FALSE,并且使每一列的总和是该列前面总和的总和),我使图形看起来像是我想要的样子。现在的问题是tooltip显示的数字不正确(正确)。

问题:有没有办法格式化工具提示以显示正确的数字(包括彩色点)或以其他方式创建图形?

enter image description here

例如,图片在tooltip上显示了错误的数字,我希望它显示出来:

  • DIH目标:21小时
  • 报价保留时间:6.2小时
  • 其他等待时间:19.3hrs
  • 购物时间:3.4小时

代码:

highchart() %>%
  hc_add_series(TopPN2, "column", hcaes(x = Incoming.P.N, y = 21), name = "DIH Goal", color = "#ffffff", borderColor = "#C8C8C8", pointPadding = -0.1) %>%
  hc_add_series(TopPN2, "column", hcaes(x = Incoming.P.N, y = round(HoldTime.Quote,1)), name = "Quote Hold Time", color = "#FF8888") %>%
  hc_add_series(TopPN2, "column", hcaes(x = Incoming.P.N, y = round(Hold.Time.Other,1)), name = "Other Hold Time", color = "#E5A919") %>%
  hc_add_series(TopPN2, "column", hcaes(x = Incoming.P.N, y = round(Shop.Time,1)), name = "Shop Time", color = "#51C1BC") %>%
  hc_xAxis(type = "category") %>%
  hc_yAxis(title = "hours", labels = list(format = "{value}hrs")) %>%
  hc_tooltip(crosshairs = TRUE, shared = TRUE, headerFormat = "<b>{point.name}</b>", valueSuffix = "hrs") %>%
  hc_plotOptions(column = list(grouping = FALSE))

数据:

> dput(TopPN2)
structure(list(Incoming.P.N = c("PN1", "PN2", "PN3", "PN4", "PN5", 
"PN6", "PN7", "PN8", "PN9", "PN10"), HoldTime.Quote = structure(c(28.8846153846154, 
32.548, 21.8717948717949, 57.4931506849315, 64.4074074074074, 
40.0833333333333, 14, 29.680790960452, 36.6506024096386, 48.1111111111111
), class = "difftime", units = "days"), Hold.Time.Other = structure(c(22.7307692307692, 
21.56, 16.7435897435897, 10.7123287671233, 47.1851851851852, 
23.1666666666667, 6, 8.17231638418079, 25.1807228915663, 24.6666666666667
), class = "difftime", units = "days"), Shop.Time = c(3.40698998178506, 
4.83416980342953, 3.33075767332046, 4.39068799583821, 5.35449386300647, 
5.20028749401054, 3.43263196751569, 5.59119496855346, 4.27753861737149, 
5.61884753901561), Quantity = c(17568, 9564, 9318, 7689, 7577, 
6261, 5418, 5088, 3949, 3332)), .Names = c("Incoming.P.N", "HoldTime.Quote", 
"Hold.Time.Other", "Shop.Time", "Quantity"), row.names = c(NA, 
-10L), class = c("tbl_df", "tbl", "data.frame"))

UPDATE

沿着仅格式化tooltip的路径前进。我创建了新的变量来表示正确的时间,但是我无法弄清楚如何在tooltip中输入正确的色点。在这里找到的示例:How to use the tooltip formatter and still display chart color (like it does by default)?显示了如何在JS中执行此操作,但我无法在R中弄清楚。我的问题是我不知道如何使用color span之间的双引号来使它会选择正确的颜色。

更新数据:

> dput(TopPN2)
structure(list(Incoming.P.N = c("PN1", "PN2", "PN3", "PN4", "PN5", 
"PN6", "PN7", "PN8", "PN9", "PN10"), Hold.Time.Quote = structure(c(28.8846153846154, 
32.548, 21.8717948717949, 57.4931506849315, 64.4074074074074, 
40.0833333333333, 14, 29.680790960452, 36.6506024096386, 48.1111111111111
), class = "difftime", units = "days"), Hold.Time.Other = structure(c(22.7307692307692, 
21.56, 16.7435897435897, 10.7123287671233, 47.1851851851852, 
23.1666666666667, 6, 8.17231638418079, 25.1807228915663, 24.6666666666667
), class = "difftime", units = "days"), Shop.Time = c(3.40528709494031, 
4.83058282849384, 3.33075767332046, 4.38978424746556, 5.35178594965072, 
5.19380460683082, 3.43263196751569, 5.59119496855346, 4.27753861737149, 
5.61884753901561), Quantity = c(17590, 9574, 9318, 7694, 7587, 
6295, 5418, 5088, 3949, 3332), HoldTimeQuoteTrue = structure(c(6.2, 
11, 5.1, 46.8, 17.2, 16.9, 8, 21.5, 11.5, 23.4), class = "difftime", units = "days"), 
    HoldTimeOtherTrue = structure(c(18.8, 16.8, 13.7, 5.7, 38.6, 
    15.3, 0, 1.9, 20, 15.4), class = "difftime", units = "days"), 
    ShopTimeTrue = c(3.4, 4.8, 3.3, 4.4, 5.4, 5.2, 3.4, 5.6, 
    4.3, 5.6)), .Names = c("Incoming.P.N", "Hold.Time.Quote", 
"Hold.Time.Other", "Shop.Time", "Quantity", "HoldTimeQuoteTrue", 
"HoldTimeOtherTrue", "ShopTimeTrue"), row.names = c(NA, -10L), class = c("tbl_df", 
"tbl", "data.frame"))

更新代码:

highchart() %>%
  hc_add_series(TopPN, "column", hcaes(x = Incoming.P.N, y = 21), name = "DIH Goal", color = "#ffffff", borderColor = "#C8C8C8", borderWidth = 2, pointPadding = -0.1, 
                tooltip = list(pointFormat = "DIH Goal: 21 days<br>")) %>%
  hc_add_series(TopPN, "column", hcaes(x = Incoming.P.N, y = round(Hold.Time.Quote,1)), name = "Quote Hold Time", color = "#FF8888", 
                tooltip = list(pointFormat = "<span style='color:{point.color}'>\u25CF</span> Quote Hold Time: {point.HoldTimeQuoteTrue} days<br>")) %>%
  hc_add_series(TopPN, "column", hcaes(x = Incoming.P.N, y = round(Hold.Time.Other,1)), name = "Other Hold Time", color = "#E5A919", 
                tooltip = list(pointFormat = "{point.color} Other Hold Time: {point.HoldTimeOtherTrue} days<br>")) %>%
  hc_add_series(TopPN, "column", hcaes(x = Incoming.P.N, y = round(Shop.Time,1)), name = "Shop Time", color = "#51C1BC", 
                tooltip = list(pointFormat = "Shop Time: {point.ShopTimeTrue} days<br>Volume: {point.Quantity}")) %>%
  hc_xAxis(type = "category") %>%
  hc_yAxis(title = "days", labels = list(format = "{value} days")) %>%
  hc_tooltip(crosshairs = TRUE, shared = TRUE, 
             headerFormat = "<b>PN {point.key}</b><br>"
             ) %>%
  hc_plotOptions(column = list(grouping = FALSE, events = list(click = ClickFunctionCustReviewPN)))

1 个答案:

答案 0 :(得分:0)

您是否考虑过使用绘图线来说明您的目标及其与数据的关系,而不是使用分组列的技巧?由于您的目标数据是一致的,因此这可能是更具可读性的指标。而且,由于它不在图表中,因此不会干扰工具提示。

这是Highcharts堆积柱形图演示的修改,其中带有示例绘图线:https://jsfiddle.net/brightmatrix/v3e7gouz/

yAxis: {
    ...
    plotLines: [{ 
        color: 'red', 
        value: 5, // the value on the y-axis were you want the line to appear
        width: 2, 
        zIndex: 1 // set this value to have the line appear above the y-axis gridline but below the column bars
    }],
    ...
}

enter image description here

我希望这对您有帮助。