Настройка графического интерфейса Google

Question

У меня есть эти линейные диаграммы здесь с данными в реальном времени от arduino.

Что я хочу сделать, это сделать первый график (температура) лучше выглядит. Я хочу, чтобы у меня всегда были пробелы сверху и снизу (как влажность), и я хочу увеличить ширину Y-оси температуры. Это возможно ?

Обе карты закончились с точно такими же настройками:

function drawTemperature() { 
    $.ajax({ 
     url: 'http://192.168.1.3/Charts/chart_temperature.php', 
     dataType: 'json', 
     success: function (jsonData) { 
      // Create our data table out of JSON data loaded from server. 
      var data = new google.visualization.DataTable(jsonData); 

      var options = { 
       'title': 'Temperature', 
       'width': 1200, 
       'height': 600 
       //'legend.alignment' : 'start', 
       //'hAxis.baseline' : 5, 
       //'chartArea.top' : 20, 
       //'chartArea.left' : 500 
       //'focusTarget' : 'category' 
       //'animation.easing' : 'inAndOut' 
       //colors:['blue','#004411'], 
       //'hAxis.maxValue' : 30, 
       //'hAxis.showTextEvery' : 0.1, 
       //'hAxis.logScale' : 'true', 
       //'hAxis.gridlines.color' : '#00CC00', 
       //'hAxis.maxAlternation' : 10, 
       //'hAxis.viewWindow.max' : 10 

       //'curveType': 'function' 
      }; 

      // Instantiate and draw our chart, passing in some options. 
      var chart = new google.visualization.LineChart(document.getElementById('chart_temperature')); 
      chart.draw(data, options); 
     } 
    }); 
} 

function drawHumidity() { 
    $.ajax({ 
     url: 'http://192.168.1.3/Charts/chart_humidity.php', 
     dataType: 'json', 
     success: function (jsonData) { 
      // Create our data table out of JSON data loaded from server. 
      var data = new google.visualization.DataTable(jsonData); 

      // Instantiate and draw our chart, passing in some options. 
      var chart = new google.visualization.LineChart(document.getElementById('chart_humidity')); 
      chart.draw(data, {width: 1200, height: 600}); 
     } 
    }); 
} 

function drawVisualization() { 
       drawTemperature(); 
       drawHumidity(); 

      } 

Answer 1

Вы можете создать «пробелы» в верхней и нижней части диаграммы вы, установив vAxis.minValue и vAxis.maxValue опции для значений меньше минимальный и максимальный (соответственно) данные вашего графика. Вот один из способов сделать это:

var range = data.getColumnRange(1); 
var options = { 
    title: 'Temperature', 
    width: 1200, 
    height: 600, 
    vAxis: { 
     minValue: range.min - 1, 
     maxValue: range.max + 1 
    } 
};