Highcharts中的柱形图 - 单击

时间:2015-06-25 16:51:47

标签: javascript jquery r charts highcharts

我在 rCharts 中使用 Highcharts 来制作交互式柱形图。我的数据分为40个组,所以我自然摆脱了传说。但是,我仍然希望保持选择特定系列的功能,方法是单击列并选择该系列,或者通过将鼠标悬停在列上并调暗所有其他系列,或两者兼而有之。到目前为止,我的代码如下。我已成功添加了单击以选择选项,但我未能添加选择系列功能。

h1 <- hPlot(x = "x", y = "y", group = "group", data = data, type = "column")
h1$legend(enabled=FALSE)
h1$chart(height=700, width=700)
h1$title(text = "Title")
h1$subtitle(text = "Subtitle")
h1$yAxis(title = list(text = "yAxis"))
h1$xAxis(title = list(text = "xAxis"))
h1$tooltip(formatter = "#! function(){return('<b>x: </b>' + this.x + '<br/>' +
       '<b>y: </b>' + this.series.name + '<br/>' +
       '<b>z: </b>' + Highcharts.numberFormat(100*this.y,2)) + 
       '<b>%</b>';} !#")
h1$plotOptions(series = list(allowPointSelect = 'true'))

以下是交互式情节示例http://tmp.ocpu.io/x0b4763059b/files/output.html 因此,我想点击/悬停在列上来切换/照亮特定系列,而不是单击图例来打开/关闭系列。

1 个答案:

答案 0 :(得分:1)

我已经弄清楚了。添加了:

h1$plotOptions(
  series = list( 
    point = list(
      events = list(
        click = "#! function() {
          if (chart.series[0].visible) {
            for (var i = 0; i < chart.series.length; i++) {
              chart.series[i].hide();
            }
            this.series.show();
          } else {
            for (var i = 0; i < chart.series.length; i++) {
              chart.series[i].show();
            }
          }
        } !#"))
    )
)

并删除:

h1$plotOptions(series = list(allowPointSelect = 'true'))