Fixing the decimals on y axis to 5 places

Question

I am trying to solve the following three problems

1. Decimal Places on Y Axis (all Axis) - should be constant 5
2. Decimal Places on Tooltip - should be constant 5
3. Adding a Suffix to all points on the tooltip

I need to keep the values shown on the on Y Axis fixed to 5 decimal places ( say 0.96724 or 1.55400 ) as received from the data feed.

I have forked and created a new jsfiddle to highlight the problem. This shows only upto two digits. From various examples, I tried to create a tooltip, but it did not worked.

Any help or pointers would be highly appreciated. Created a jsfiddle below

Regards Amit

http://jsfiddle.net/amonga141/tgz469a5/2/

// Some styling options for yAxis
Highcharts.theme = {
    yAxis: {
        gridLineWidth: 1,
        gridLineColor: "rgb(240, 240, 240)",
        minorGridLineColor: 'rgba(255, 255, 255, 0.07)',
        lineColor: "rgb(241, 141, 5)",
        lineWidth: 1,
        tickColor: "rgb(241, 141, 5)",
        tickWidth: 1,
        showEmpty: false,
        labels: {
            style: {
                color: 'rgb(102, 102, 102)',
                fontWeight: 'bold'
            }
        },
        title: {
            style: {
                color: 'rgb(229, 64, 40)',
                font: "bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif"
            }
        }
    }
};

// Apply the styling options
Highcharts.setOptions(Highcharts.theme);

Highcharts.setOptions({
    global: {
        useUTC: false
    }
});

// Data generator helper
function data(start, end, samples, min, max) {
    var temp = [];
    var range = ~~ ((end - start) / samples);
    for (var i = 1; i < samples; i++) {
        temp.push([start.getTime() + range * i, min + Math.random() * (max - min)]);
    }
    return temp;
}

// 
var tooltipSuffix ='<br> TTIP Sufix:Suffix';
// Create a timer
var now = new Date();
var start = new Date(now - 60000);

var example_data = [{
    name: 'Signal 1',
    data: data(start, now, 20, 1.55478, 1.55481),
    yAxis: 0
}, {
    name: "Signal 2",
    data: data(start, now, 20, 1.32419,  1.13253),
    yAxis: 1
}, {
    name: "Signal 3",
    data: data(start, now, 20, 0.97456, 0.97545),
    yAxis: 2
}];

//////////////////////
// Chart definition //
//////////////////////
var chart = $("#chart").highcharts({
    legend: {
        enabled: true
    },
    chart: {
        animation: Highcharts.svg,
        events: {
            load: function () {
                // set up the updating of the chart each second
                var chart = this,
                    series = chart.series;

                setInterval(function () {
                    var x = new Date(); // current time

                    series[0].addPoint(data(x, x, 2, 1.55678, 1.59133)[0], false, true);
                    series[1].addPoint(data(x, x, 2, 1.33456, 1.39921)[0], false, true);
                    series[2].addPoint(data(x, x, 2, 0.95989, 0.99092)[0], false, true);

                    chart.redraw();
                }, 2000);
            }
        }
    },
   yAxis: [{
        opposite: false,
        showRects: true,
        offset: 40,
        title: {
            text: 'Scale 1'
        }
    }, {
        opposite: true,
        showRects: true,
        offset: 90,
        title: {
            text: 'Scale 2'
        }
    }, {
        opposite: false,
        showRects: true,
        offset: 140,
        title: {
            text: 'Scale 3'
        }
    }],
    xAxis: {
        type: 'datetime'
    },
//    tooltip: {
//                  xDateFormat: '%A, %b %e, %H:%M:%S', // Shows only [Day, Mon dd, hh:mi:ss]
//                  shared: true,
//                    pointFormat: ' <span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> <br/>'+tooltipSuffix,
//                    valueDecimals: 5,
//                    crosshairs: true
//    } ,
    series: example_data
});

<div id="chart"></div>

Answer 1

See Working fiddle with your code here

For labels use following in your options of yAxis.

 labels: {
        format: '{value:.5f}',
  }

for tooltip see the formatter function below

 tooltip: {     
                shared: true,
                pointFormat: ' <span style="color:{series.color}">{series.name}</span>: <b>{point.y:.5f}</b>'+tooltipSuffix+' <br/>',

   }