Question

我使用Chart.js制作线图。由于标签，图表左侧有一个空白区域。

这是图表的代码

//De gegevens  worden vanuit de API opgehaald.
$(document).ready(function(){
  $.ajax({
    url : XX,
type : "GET",
success : function(data){


  var datetime = [];//Datum en tijd worden in een variabele gezet.
  var temperature = [];//Temperatuur wordt in een variabele gezet.
//   var humidity = [];//Luchtvochtigheid wordt in een variabele gezet.
//   var co2 = [];//Co2 wordt in een variabele gezet.




    //Zolang er data is wordt de temperatuur en datum/tijd opgehaald.
  for(var i in data) {
//    datetime.push(data[i].datetime);
    if (data[i].temperature) {

    temperature.push(data[i].temperature);
    datetime.push(data[i].datetime);
    }
 //   humidity.push(data[i].humidity);
 //   co2.push(data[i].co2);
  }



//Grafiek temperatuur-----------------------------------------------------

  var chartdata = {
    labels: datetime.reverse(), //Datum en tijd op de horizontale as
    datasets: [
      {
        label: "Temperatuur", //Bij de legenda staat dit weergegeven.
        fill: false, //De ruimte onder de lijn wordt niet gevuld.
        borderWidth: 1,
        backgroundColor: 'white', //De kleur van de lijn is wit
        borderColor: 'white', //De kleur van de punten is wit
        pointBorderWidth: 30,
        pointHitRadius: 20,
        spanGaps: true,
        pointHoverBackgroundColor: "rgba(59, 89, 152, 1)", //Zodra er over de lijn gehovert wordt, wordt hij deze kleur
        pointHoverBorderColor: "rgba(59, 89, 152, 1)", // Dit geldt ook voor de punten.
        data: temperature.reverse(), //De data uit variabele 'temperatuur' wordt in de grafiek gezet.
        showLine: true, //De grafiek moet een lijn weergeven, maar dit doet hij op dit moment niet.
        radius: 0, //Zodra er een lijn is, kunnen de punten hiermee uitgeschakeld worden.
      },
              ]



  };

  // Configuration options go here




  var ctx = $("#mycanvas");

  var LineGraph = new Chart(canvas, {
    type: "line", //De grafiek is een lijn
    data: chartdata, //De data die in het stuk hierboven is gedefinieerd wordt gebruikt.
    responsive: true, //Hij is responsive
    options: {
        legend: {
        display: true, //De legenda wordt weergegeven.

     },
     tooltips: {
        enabled: true, //De info die tevoorschijn komt als men over het bolletje hovert komt wel tevoorschijn.
     },
        maintainAspectRatio: false, //De verhoudingen blijven niet hetzelfde.
        chartArea: {
            backgroundColor: gradient, //De achtergrondkleur is de gradient die aan het begin van het document gemaakt is.
        },

  scales: {

    yAxes: [{
        display: true, //De Y as wordt weergegeven
        position: 'right', //Aan de rechter kant
        ticks: {
            suggestedMin: 0,    //Het minimum is 0, behalve als er een lagere 
waarde is.
            suggestedMax: 30,   //Het maximum is 30

        }
    }]
            }
}

  });
},
error : function(data) {

}
});
});

我找到了解决这个问题的方法，如果它已经在右边，但我无法弄清楚如何在左侧使用它。

除此之外，我想知道是否可以将x轴上的日期和时间更改为更简单的日期符号，而不是+00：00等。我已尝试多次，但我无法修复它

删除左侧ChartJS＆amp;的空白区域。改变日期

0 个答案: