Question

我有一个这种类型的json文件：

[["SSL Certificate Signed Using Weak Hashing Algorithm",4500,"98","10980"],["SSL Self-Signed Certificate",2000,"98","-1"],...]

和javascript代码：

$(document).ready(function() {   
var options = {     
chart: {renderTo:'grafico1',type:'column'},     
series: [{    }]    
};   

$.getJSON('json.json', function(data){    
options.series[0].data = data;     
var chart = new Highcharts.Chart(options); 
 });
});

在生成的图形中，各列完美地指示了数组的数值。除了数值外，数组的第一个元素也会正确显示在工具提示中。我希望数组的第三个和第四个元素出现在工具提示中，我该怎么办？

Answer 1

使用键功能将这些值锚定到点对象中，
使用tooltip.formatter回调设置显示的工具提示的格式，

演示：https://jsfiddle.net/BlackLabel/jrhdg7ue/

  tooltip: {
    formatter() {
      let output = `<span style="font-size: 10px">${this.key}</span><br/>` + `<span style="color:${this.color}">●</span> ${this.series.name}: <b>${this.y}</b><br/> value: ${this.point.value} <br/> value1: ${this.point.value1}`

      return output
    }
  },

API：https://api.highcharts.com/highcharts/tooltip.formatter

API：https://api.highcharts.com/highcharts/series.line.keys

如何在海图图表的工具提示中插入数据？

1 个答案: