Y轴堆叠条形图中的链接

Question

我是Highcharts的总新手，特别是Javascript。我想知道如何将超链接放在y轴上的标签后面。到目前为止，我无法在文档或这里找到答案。我有这样的事情：

Highcharts.chart('container', { 
    chart: { 
     type: 'bar' 
    }, 
    title: { 
     text: '' 
    }, 
    colors: ['#c83f3f', '#66b257'],  
    fontFamily: 'Merriweather Sans, sans-serif', 
     xAxis: { 
     categories: ['Test 1', 'Test 2', 'Test 3', 'Test 4', 'Test 5', 'Test 6', 'Test 7', 'Test 8'] 
    }, 
    yAxis: { 
     min: 0, 
     max: 10, 
     title: { 
      text: '' 
     } 
    }, 
    legend: { 
     reversed: true 
    }, 
    plotOptions: { 
     series: { 
      stacking: 'normal' 
     } 
    }, 
    series: [{ 
     name: 'Nicht erfüllte Kriterien', 
     data: [5, 3, 4, 7, 2, 6, 4, 5] 
    }, { 
     name: 'Erfüllte Kriterien', 
     data: [5, 7, 6, 3, 8, 4, 6, 5] 
    }] 
}); 

现在我想放链接到外部网站背后的“测试2”，“测试2”等标签。 - 我会怎么做？

非常感谢！ -Oliver

Answer 1

您可以给anchor<a>标签中的categories数组xAxis。随着指定的it.like链接这样的：

 categories: ['<a href="http://stackoverflow.com">Test 2', 
'<a href="http://stackoverflow.com/questions">Test 5</a>'] 

示例代码：我已经给这个样品中的链接测试2和测试5：

Highcharts.chart('container', { 
 
    chart: { 
 
     type: 'bar' 
 
    }, 
 
    title: { 
 
     text: '' 
 
    }, 
 
    colors: ['#c83f3f', '#66b257'],  
 
    fontFamily: 'Merriweather Sans, sans-serif', 
 
     xAxis: { 
 
     categories: ['Test 1', '<a href="http://stackoverflow.com">Test 2', 'Test 3', 'Test 4', '<a href="http://stackoverflow.com/questions">Test 5</a>', 'Test 6', 'Test 7', 'Test 8'] 
 
    }, 
 
    yAxis: { 
 
     min: 0, 
 
     max: 10, 
 
     title: { 
 
      text: '' 
 
     } 
 
    }, 
 
    legend: { 
 
     reversed: true 
 
    }, 
 
    plotOptions: { 
 
     series: { 
 
      stacking: 'normal' 
 
     } 
 
    }, 
 
    series: [{ 
 
     name: 'Nicht erfüllte Kriterien', 
 
     data: [5, 3, 4, 7, 2, 6, 4, 5] 
 
    }, { 
 
     name: 'Erfüllte Kriterien', 
 
     data: [5, 7, 6, 3, 8, 4, 6, 5] 
 
    }] 
 
});

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
 
<script src="https://code.highcharts.com/highcharts.js"></script> 
 
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>