高图表中的柱形图-点击选择系列

Column chart in Highcharts - select series with a click

本文关键字：选择 系列 -点 柱形图 高图表      更新时间：2023-09-26

我正在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因此，我不想点击图例来打开/关闭系列，而是想点击/悬停在列上来切换/照亮特定的系列。

我已经想通了。添加：

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'))
相关文章：