javascript - Highcharts 获取选中的列索引

标签 javascript jquery highcharts

我有一个柱形图,我希望能够分配一个点击事件,该事件会触发一个 window.open() 到一个动态生成的 URL。我有一个数组,其中包含 x 轴的元素,如果我可以获得指向所选列的指针,我可以使用它来生成 window.open() 的 URL。下面是图表的代码。

    $(document).ready(function () {
    chart = new Highcharts.Chart({

        chart: {
            renderTo: 'container',
            defaultSeriesType: 'column',
            margin: [50, 50, 350, 50]
        },

        title: {
            text: 'E-Tags Cause'
        },
        xAxis: {
            categories: _MyArray2,
            labels: {
                rotation: 45,
                align: 'left',
                style: {
                    fontSize: '18px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        },
        yAxis: {
            title: {
                text: 'Count'
            }
        },
        plotOptions: {
            column: {
                events: {
                    click: function (event) {
                        window.open('test' +  + '.html');
                    }
                }
            }
        },
        series: [{
            name: 'E-Tag Count',
            data: _MyArray,
            pointWidth: 40,
            dataLabels: {
                enabled: true,
                rotation: 0,
                color: '#000000',
                align: 'center',
                x: -3,
                y: -2,
                formatter: function () {
                    return this.y;
                },
                style: {
                    fontSize: '14px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        }]
    });
    $('tspan').last().remove();
});

感谢任何帮助。

最佳答案

编辑

添加 point 列后的对象

WORKING JSFIDDLE

   $(function() {
      chart = new Highcharts.Chart({

          chart: {
              renderTo: 'container',
              defaultSeriesType: 'column'
          },

          title: {
              text: ''
          },

          xAxis: {
              categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May',
                      'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
          },

          plotOptions: {
              column :{
                  point:{
                      events:{
                          click:function(){
                            window.open(this.x + '.html') ;
                          }
                      }
                  }
              }
          },

          series: [{
              data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 
                   135.6, 148.5, 216.4,     194.1, 95.6, 54.4]
               }],

              navigation: {
                  buttonOptions: {
                      align: 'center'
                  }
              }
          });




      });​

关于javascript - Highcharts 获取选中的列索引,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11316758/

相关文章:

javascript - 有漏斗图而不是 Highcharts 的图表库吗?

javascript - localStorage 删除一个值并保留现有值

javascript - Highcharts - 日期时间轴标签重叠

javascript - new Date() 12/24 小时格式 JavaScript?

javascript - onFinish 执行时加载 jQuery 事件

javascript - Cropit 将 Canvas 图像上传到 NodeJS

javascript - 在不同的浏览器中打开 URL

javascript - create-react-app Uncaught (in promise) 语法错误 : Unexpected token < in JSON at position 0

javascript - 在 Node js/javascript中的 map 函数之外获取异步等待数据

javascript - CSS 不适用于首次点击