向下钻取中的多个系列

时间:2018-09-10 00:36:13

标签: r highcharts drilldown

我正在R中创建向下钻取图,并希望其中一层是具有多个组的线图。

我已经弄清楚了如何创建折线图,但是我似乎无法从单个序列向下钻取到多个序列。 如果我在相同的ID上链接两个系列(从我在JavaScript上阅读的内容获得了这个想法),则只会出现第二个系列。

关于如何进行的任何想法?

编辑*更新代码

df <- data_frame(
  name = c("Animals", "Fruits", "Cars"),
  y = c(5, 2, 4),
  drilldown = tolower(name)
)

df

dfan <- data_frame(
  name = c("Cats", "Dogs", "Cows", "Sheep", "Pigs"),
  value = c(4, 3, 1, 2, 1)
)

dfru <- data_frame(
  name = c("Apple", "Pear", "Orange"),
  value = c(4, 3, 1)
)

dfcar <- data_frame(
  name = c("Toyota", "Opel", "Volkswagen"),
  value = c(4, 2, 2)
)

dfcar2 <- data_frame(
  name = c("Toyota", "Opel", "Volkswagen"),
  value = c(6, 7, 2)
)


car_series = merge(dfcar, dfcar2, by = "name")

hc <- highchart() %>%
  hc_chart(type = "column",
           events = list(
             click = JS(fn))) %>%
  hc_title(text = "Basic drilldown") %>%
  hc_xAxis(type = "category") %>%
  hc_legend(enabled = FALSE) %>%
  hc_plotOptions(
    series = list(
      boderWidth = 0,
      dataLabels = list(enabled = TRUE)
    )
  ) %>%
  hc_add_series(
    data = df,
    name = "Things",
    colorByPoint = TRUE
  )

hc <- hc %>%
  hc_drilldown(
    allowPointDrilldown = TRUE,
    series = list(
      list(
        id = "animals",
        data = list_parse2(dfan)
      ),
      list(
        id = "fruits",
        data = list_parse2(dfru)
      ),
      list(
        id = "cars",
        type = "line",
        data = list_parse2(car_series)
      )
    )
  )

hc


fn <-"function () {
var chart = Highcharts.charts[0];
var drilldown = this.drilldown;
var len = chart.series.length;
var name = null, 
categories = drilldown.categories, 
data = drilldown, 
type = drilldown.type;
chart.xAxis[0].setCategories(categories);
for(var i = 0; i < len; i++){
chart.series[0].remove();
}

if(data.series){
for( i = 0; i < data.series.length; i ++ ){
chart.addSeries({
name: data.series[i].name,
data: data.series[i].data,
type: data.series[i].type,
});
}
} else {
chart.addSeries({
name: name,
data: data,
type: type,

});
}
} 
"

1 个答案:

答案 0 :(得分:0)

实际上,您只需要压缩示例中的代码并将其粘贴到JS()事件处理程序上的chart.events.drilldown R函数中即可。这是代码:

drilldown = JS("function(e) {if(!e.seriesOptions){var chart=this,drilldowns={'Animals':{name:'Animals',data:[['Cows',2],['Sheep',3]]},'Animals2':{name:'Animals',color:'#f00',data:[['Cows',22],['Sheep',13]]},'Fruits':{name:'Fruits',data:[['Apples',5],['Oranges',7],['Bananas',2]]},'Fruits2':{name:'Fruits',color:'red',data:[['Apples',15],['Oranges',17],['Bananas',22]]},'Cars':{name:'Cars',data:[['Toyota',1],['Volkswagen',2],['Opel',5]]},'Cars2':{name:'Cars',color:'#bada55',data:[['Toyota',11],['Volkswagen',21],['Opel',15]]}},series=[drilldowns[e.point.name],drilldowns[e.point.name+'2']];chart.addSingleSeriesAsDrilldown(e.point,series[0]);chart.addSingleSeriesAsDrilldown(e.point,series[1]);chart.applyDrilldown()}}")

我在R Studio环境中进行了测试,效果很好。

亲切的问候!