Question

我有这样的Highcharts图表：http://jsfiddle.net/tasrgpqL/

在＆＃39; plotOptions＆＃39;我添加了一个click事件，当单击其中一个栏时触发警报。但是现在我想为整个列添加一个click事件，而不仅仅是条形。我怎么能这样做？

plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0,
            point:{
              events:{
                click: function(event) {
                  alert('test');
                }
              }
            }
        },

    },

Answer 1

您需要在图表选项中添加click事件：

 chart: {
    events: {
       click: function (event) {
          alert("clicked column");
       }
    },

这是 FIDDLE

Answer 2

为了获取点击列的数据，我使用了这样的PHP：

// Convert PHP array to JSON object
var subjects = <?php echo json_encode($subjects); ?>

$('#chart').highcharts({
    chart: {
        events:{
            click: function(event) {
                // Get clicked column by looking for rounded click posistion of x-axis in JSON object
                var column = Math.abs(Math.round(event.xAxis[0].value));
                var id = subjects[column];
            }
        }
    },
    xAxis: {
        categories: [
            // Create JSON by looping through array
            <?php foreach($subjects as $subject): ?>
                {name: '<?=$subject['name']?>', y: 1, id: <?=$subject['id']?>},
            <?php endforeach; ?>
        ]
    }
});

我知道它有点难看，但我还没有找到另一种方式。

Highcharts点击列（不是栏）

2 个答案: