Highstock/highcharts show multiple y-axis values in single tooltip

Question

I have a highstock chart with two y-axes. When I mouseover the chart, the default tooltip only shows one of the y-axis, unless I directly put my mouse over the excluded series' point. Is there a way to just show both y-axes in the tooltip at whatever x value the mouse is over in the chart?

Answer 1

Set tooltip.shared = true

See http://api.highcharts.com/highcharts#tooltip.shared and http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/tooltip/shared-true-mixed-types/

Answer 2

I guess that you need something which map points between axis. Its not built-in, but you can use formatter and prepare something like this:

formatter: function(){
            var y = this.y,
                txt = 'y1: ' + y,
                yAxis = this.series.yAxis,
                index = this.series.yAxis.options.index == 0 ? 1 : 0,
                oAxis = this.series.chart.yAxis[index];

            txt += '<br>y2: ' + oAxis.toValue(yAxis.toPixels(y));

            return txt;
 }

http://jsfiddle.net/bu7ryzfL/