[Solved]-ChartJS Line chart cut off at the top and bottom-Chart.js

I think you've pretty much got it as is, just one configuration issue in the options object.

You currently have these options:

options: {
   title: {
     display: true,
     text: 'Wetterdaten'
   },
   yAxes: [{
     ticks: {
       stepSize: 10
     }
   }]
}

but what is missing, is that the yAxes array property has to be inside of a scales object. Like this:

options: {
   title: {
     display: true,
     text: 'Wetterdaten'
   },
   scales: {
     yAxes: [{
       ticks: {
         stepSize: 10
       }
     }]
   }
}

With this config in options your stepSize property will kick in and the top of the graph will be 20 when showing just the temperature data.

BUT

Now that the stepSize for the entire yAxis is 10, the pressure dataset goes way out of wack. So for this problem, you could implement two yAxes, where the pressure data is on the right yAxes and everything else is on the left yAxes:

var weatherCanvas = document.getElementById('weatherChart').getContext('2d');
var weatherChart = new Chart(weatherCanvas, {
    type: 'line',
    title: 'Wetter',
    data: {
        labels: ["01-01", "02-01", "03-01", "04-01", "05-01", "06-01", "07-01", "08-01", "09-01"],
        datasets: [{
            label: 'Temperature[°C]',
            data: [14, 18, 18, 16, 14, 11, 11, 11, null],
            borderColor: "rgb(252, 74, 74)",
            yAxisID: 'left-y-axis'
        }, {
            label: 'Windspeed[km/h]',
            data: [14, 18, 18, 16, 14, 11, 11, 11, null],
            borderColor: "rgb(101, 219, 255)",
            hidden: true,
            yAxisID: 'left-y-axis'
        }, {
            label: 'Humidity[%]',
            data: [84, 88, 88, 86, 74, 71, 71, 71, null],
            borderColor: "rgb(101, 155, 255)",
            hidden: true,
            yAxisID: 'left-y-axis'
        }, {
            label: 'Pressure[hPa]',
            data: [1193, 1211, 1211, 1200, 1999, 1997, 1995, 1993, null],
            borderColor: "rgb(211, 211, 211)",
            hidden: true,
            yAxisID: 'right-y-axis'
        }]
    },
    options: {
        title: {
            display: true,
            text: 'Wetterdaten'
        },
        scales: {
            yAxes: [{
                id: 'left-y-axis',
                position: 'left',
                ticks: {
                    stepSize: 10
                }
            }, {
                id: 'right-y-axis',
                position: 'right',
                ticks: {
                    stepSize: 100
                }
            }]
        }
    }
});

Here is a reference to Axes Configuration with a few examples as well.

I hope this helps.