2017-04-12 41 views
0

我创建了包含一些数据的高图的示例时,Highchart更新工具提示。 you can see it here.当setData

var chart = Highcharts.chart('container', { 
    tooltip: { 
      headerFormat: '<b>{series.name}</b><br>', 
      pointFormat: '{point.x: %b %e}: <b>{point.y:.2f}</b>' 
     }, 
series: [{ 
     name : "tooltip 1", 
    data: [29.9, 71.5, 106.4, 129.2, 144.0] 
}] 
}); 


$('#button').click(function() { 
    chart.series[0].setData([129.2, 144.0, 176.0, 135.6, 148.5]); 
}); 

我想在#button点击我们例如设置新的工具提示名称:提示2

如何在点击事件后设置新的工具提示名称?

回答

0

我想你想改变系列将在工具提示

Fiddle

$('#button').click(function() { 
    chart.series[0].setData([129.2, 144.0, 176.0, 135.6, 148.5]); 
    chart.series[0].name="tooltip 2"; 
}); 

var chart = Highcharts.chart('container', { 
 
    tooltip: { 
 
    headerFormat: '<b>{series.name}</b><br>', 
 
    pointFormat: '{point.x: %b %e}: <b>{point.y:.2f}</b>' 
 
    }, 
 
    series: [{ 
 
    name: "tooltip 1", 
 
    data: [29.9, 71.5, 106.4, 129.2, 144.0] 
 
    }] 
 
}); 
 

 

 
// the button action 
 
$('#button').click(function() { 
 
    chart.series[0].setData([129.2, 144.0, 176.0, 135.6, 148.5]); 
 
    chart.series[0].name = "tooltip 2"; 
 
});
<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="height: 400px"></div> 
 
<button id="button" class="autocompare">Set new data</button>

反映名称