繁体   English   中英

在 highcharter 中重新创建 highcharts 圆环图

[英]Recreating a highcharts donut chart in highcharter

我正在学习 highcharter,并尝试在 R http://www.highcharts.com/demo/pie-donut/grid-light 中创建类似于以下甜甜圈图的图形,但遇到了一些问题。 我从 SQL 数据库中获取数据,因此将其存储为表,例如:

Browser      Version             Pct        Total
Chrome       Chrome v30.0        0.14       24.4
Chrome       Chrome v31.0        1.24       24.4
Chrome       Chrome v32.0        0.55       24.4
...

我的代码是:

highchart() %>%
hc_title(text = "Browsers Data") %>%
hc_add_series_labels_values(unique(table$Browser), unique(table$Total), type = "pie", size = '60%',
                            dataLabels = list(distance = -50, 
                                              color = '#ffffff')) %>%
hc_add_series_labels_values(table$Version, table$Pct, type = "pie",  size = '100%', innerSize = "60%") %>%
hc_add_theme(hc_theme_gridlight())

这给了我图表,但我不确定如何制作太长而无法显示的标签,只是

dataLabels = list(formatter = "!# function(){
return this.y > 100 ? this.point.name : null;
                                   }!#")

不起作用。

而且,我的颜色也不同。 我想要一个浏览器,它的所有版本都具有相同的颜色。 任何建议如何处理这些?

我知道这是一个老问题,但是您可以使用 dataLabels 的 formatter 参数来实现这一点,方法是根据切片的大小指定应显示哪些标签。 您可以根据需要向上或向下调整。

我没有你的数据,所以我使用的是我自己的,改编自演示。 此外,highcharter 已从hc_add_series_labels_value()转移,因此我提供的代码与您的代码略有不同。

图表代码:

highchart() %>% 
  hc_add_series(type = "pie", data = browserData, hcaes(name, y), 
                size = "60%", name = "Browers", center = c(50, 50), 
                dataLabels = list(distance = -50, 
                                  formatter = JS("function () {
                                                  return this.y > 5 ? this.point.name : null;
  }"))) %>%
  hc_add_series(type = "pie", data = versionsData, hcaes(name, y), size = "80%", name = "Versions", 
                innerSize = "60%", dataLabels = list(formatter = JS("function () {
      // display only if larger than 1
      return this.y > 1 ? '<b>' + this.point.name + ':</b> ' +
        this.y + '%' : null;
    }"), id = 'versions')) %>% 
  hc_title(text = "Browser market share, January, 2018") %>% 
  hc_subtitle(text = 'Source: <a href="http://statcounter.com" target="_blank">statcounter.com</a>')

输出:

在此处输入图片说明 数据:

dput(versionsData)

structure(list(color = c("rgb(195,255,176)", "rgb(192,255,173)", 
"rgb(189,255,170)", "rgb(186,255,167)", "rgb(183,255,164)", "rgb(180,255,161)", 
"rgb(178,255,159)", "rgb(175,255,156)", "rgb(172,255,153)", "rgb(169,255,150)", 
"rgb(166,255,147)", "rgb(163,255,144)", "rgb(161,254,142)", "rgb(158,251,139)", 
"rgb(155,248,136)", "rgb(152,245,133)", "rgb(149,242,130)", "rgb(146,239,127)", 
"rgb(118,118,123)", "rgb(112,112,117)", "rgb(107,107,112)", "rgb(102,102,107)", 
"rgb(97,97,102)", "rgb(92,92,97)", "rgb(87,87,92)", "rgb(82,82,87)", 
"rgb(77,77,82)", "rgb(72,72,77)", "rgb(175,232,255)", "rgb(162,219,255)", 
"rgb(149,206,255)", "rgb(136,193,248)", "rgb(255,214,143)", "rgb(255,205,134)", 
"rgb(255,197,126)", "rgb(255,188,117)", "rgb(255,180,109)", "rgb(255,171,100)", 
"rgb(255,143,179)", "rgb(255,130,166)", "rgb(255,117,153)", "rgb(253,104,140)", 
"rgb(179,184,255)", "rgb(162,167,255)", "rgb(145,150,250)", "rgb(255,255,135)"
), name = c("Chrome v65.0", "Chrome v64.0", "Chrome v63.0", "Chrome v62.0", 
"Chrome v61.0", "Chrome v60.0", "Chrome v59.0", "Chrome v58.0", 
"Chrome v57.0", "Chrome v56.0", "Chrome v55.0", "Chrome v54.0", 
"Chrome v51.0", "Chrome v49.0", "Chrome v48.0", "Chrome v47.0", 
"Chrome v43.0", "Chrome v29.0", "Firefox v58.0", "Firefox v57.0", 
"Firefox v56.0", "Firefox v55.0", "Firefox v54.0", "Firefox v52.0", 
"Firefox v51.0", "Firefox v50.0", "Firefox v48.0", "Firefox v47.0", 
"Internet Explorer v11.0", "Internet Explorer v10.0", "Internet Explorer v9.0", 
"Internet Explorer v8.0", "Safari v11.0", "Safari v10.1", "Safari v10.0", 
"Safari v9.1", "Safari v9.0", "Safari v5.1", "Edge v16", "Edge v15", 
"Edge v14", "Edge v13", "Opera v50.0", "Opera v49.0", "Opera v12.1", 
"Other"), y = c(0.1, 1.3, 53.02, 1.4, 0.88, 0.56, 0.45, 0.49, 
0.32, 0.29, 0.79, 0.18, 0.13, 2.16, 0.13, 0.11, 0.17, 0.26, 1.02, 
7.36, 0.35, 0.11, 0.1, 0.95, 0.15, 0.1, 0.31, 0.12, 6.2, 0.29, 
0.27, 0.47, 3.39, 0.96, 0.36, 0.54, 0.13, 0.2, 2.6, 0.92, 0.4, 
0.1, 0.96, 0.82, 0.14, 7.62)), class = "data.frame", row.names = c(NA, 
-46L))

dput(browserData)
structure(list(color = c("#90ed7d", "#434348", "#7cb5ec", "#f7a35c", 
"#f15c80", "#8085e9", "#e4d354"), name = c("Chrome", "Firefox", 
"Internet Explorer", "Safari", "Edge", "Opera", "Other"), y = c(62.74, 
10.57, 7.23, 5.58, 4.02, 1.92, 7.62)), class = "data.frame", row.names = c(NA, 
-7L))

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM