Reference x y value in tooltip

Description

The following code shows how to reference x y value in tooltip.

Example


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type='text/javascript'>
$(function () {<!--from w  w w.  ja v  a 2  s.  c  o  m-->
    $('#container').highcharts({
        chart: {
            type: 'area'
        },
        tooltip: {
            pointFormat: '<b>{point.y:,.0f}</b><br/> at in {point.x}'
        },
        series: [{
            name: 'B',
            data: [null, 10421, null, 123, null, 6, 11, 32, 110, 235, 369, 640,
                10871, 123, 123, 10527, 10475,123 , 10358, 10295, 10104]
        }, {
            name: 'A',
            data: [
                5, 25, 20000, 120, 19000, 200, 426, 660, 16000, 1060, 1605, 2471, 3322,
                21000, 12, 123, 18000, 18000, 17000,123 ]
        }]
    });    
});
</script>
</head>
<body>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; max-width: 800px; margin: 0 auto"></div>

</body>
</html>

Click to view the demo





















Home »
  highcharts »
    Chart Setup »




3D Chart
Chart
Chart Style
Data
Event
Export
Legend
Title
Tooltip
Tooltip Format