[Chartjs]-Chart.js not showing data until I click on the label 3 times

Since $.getJSON() method is asynchronous, you should construct your chart inside it­‘s callback function, like so :

...
$.getJSON("./resources/chart.json", function(jsonData) {
   var index = 0;
   for (var key in jsonData) {
      if (index == 0) { // SKIP FISRT ITEM
         index++;
      } else {
         labels.push(key);
         dataValue.push(parseFloat(jsonData[key]));
      }
   }

   var dataVar = {
      labels: labels,
      datasets: [{
         label: "Value",
         backgoundColor: 'rgba(255, 0, 0, 0.2)',
         borderColor: 'rgba(255, 0, 0, 0.8)',
         borderWith: 1,
         data: dataValue
      }]
   };

   var ctx = document.getElementById("myChart");
   var myChart = new Chart(ctx, {
      type: 'line',
      data: dataVar,
      options: {
         scales: {
            yAxes: [{
               ticks: {
                  beginAtZero: true
               }
            }]
         }
      }
   });
});
...

Hopefully, this will solve your problem.