2015-10-10 2 views
0

Я пытаюсь решить следующие три задачиЗакрепление знаков после запятой по оси у до 5 мест

  1. Десятичные места на оси Y (все оси) - должна быть постоянной 5
  2. Десятичные места на подсказке - должны быть постоянным 5
  3. Добавление суффикса ко всем точкам на подсказке

мне нужно держать значения, показанные на на оси Y фиксируется до 5 знаков после запятой (скажем 0.96724 или 1.55400), полученные от подачи данных ,

У меня есть forked и создан новый jsfiddle, чтобы выделить проблему. Это показывает только до двух цифр. Из различных примеров я попытался создать всплывающую подсказку, но это не сработало.

Любая помощь или указатели будут высоко оценены. Создано jsfiddle ниже

С уважением 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> 
+0

Я обновил свой ответ и скрипку http://jsfiddle.net/Nishith/tgz469a5/4/ см ссылки –

ответ

0

Посмотреть Working fiddle with your code here

Для этикеток используют следующие в ваших настройках YAxis.

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

для подсказки увидеть функцию форматтер ниже

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

    } 
+0

Большое спасибо - Его работает очень гладко –

Смежные вопросы