Chart.js label color

I'm using chart.js to create a bar chart and can't seem to change the label colors or the legend colors. I figured out how to change the tick colors, but I'm not sure where to put the 'scaleFontColor', if that is indeed what I need to be using.

Here is a link to what it looks like now. http://imgur.com/nxaH1mk

And here is my code:

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
	scaleFontColor: "white",
    type: "bar",
    data: {
        labels: <?php echo json_encode($timeSlice); ?>, 
        datasets: [{
         	label: "A Label",
			backgroundColor: "rgba(159,170,174,0.8)",
            borderWidth: 1,
            hoverBackgroundColor: "rgba(232,105,90,0.8)",
            hoverBorderColor: "orange",
            scaleStepWidth: 1,
        	data: <?php echo json_encode($myCount); ?>
        }]
    },
    options: {
    	legend: {
    		fontColor: "white"
    	},
        scales: { 
            yAxes: [{
                ticks: {
                	fontColor: "white",
                	stepSize: 1,
                    beginAtZero: true
                }
            }]
        }
    }
});

Any help would be greatly appreciated.

Guh I solved it, sorry about the question. But I guess I'll leave an answer in case anyone else runs into my problem.

var ctx = document.getElementById("barChart");
    var myChart = new Chart(ctx, {
        type: "bar",
        data: {
            labels: ["label 1", "label 2"], 
            datasets: [{
                label: "My Label",
                backgroundColor: "rgba(159,170,174,0.8)",
                borderWidth: 1,
                hoverBackgroundColor: "rgba(232,105,90,0.8)",
                hoverBorderColor: "orange",
                scaleStepWidth: 1,
            	  data: [4, 5]
            }]
        },
        options: { 
            legend: {
                labels: {
                    fontColor: "blue",
                    fontSize: 18
                }
            },
            scales: {
                yAxes: [{
                    ticks: {
                    	fontColor: "green",
                    	fontSize: 18,
                    	stepSize: 1,
                        beginAtZero: true
                    }
                }],
                xAxes: [{
                    ticks: {
                    	fontColor: "purple",
                    	fontSize: 14,
                    	stepSize: 1,
                        beginAtZero: true
                    }
                }]
            }
        }
    });

   <!-- Edit:
   chart.js recently released new version v3.x
   which is not backwards compatible with v2.x
   -->

<!--<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>-->

   <!-- above link gets you latest version of chart.js (at v3.3.2 now)
        hence snippet didn't work propperly anymore :-(
   -->

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

   <!-- above link gets you v2.9.4
        and snippet works agian  :-)
   -->

<div>
    <canvas id="barChart" height="140"></canvas>
</div>

Good question and good answer from @PhantomSalt

His answer works perfectly well with ....... chart.js v2.xx
I modified his good code to work with .. chart.js v3.xx

(v3.xx is not backwards compatible with v2.xx)

// var ctx = document.getElementById("barChart")
const ctx = document.getElementById("barChart").getContext("2d"); // added '.getContext("2d")'

const myChart = new Chart(ctx, {
  type: "bar",
  data: {
    labels: ["label 1", "label 2"],
    datasets: [{
      label: "My Label",
      backgroundColor: "rgba(159,170,174,0.8)",
      borderWidth: 1,
      hoverBackgroundColor: "rgba(232,105,90,0.8)",
      hoverBorderColor: "orange",
      scaleStepWidth: 1,
      data: [4, 5]
    }]
  },
  options: {
    plugins: {  // 'legend' now within object 'plugins {}'
      legend: {
        labels: {
          color: "blue",  // not 'fontColor:' anymore
          // fontSize: 18  // not 'fontSize:' anymore
          font: {
            size: 18 // 'size' now within object 'font {}'
          }
        }
      }
    },
    scales: {
      y: {  // not 'yAxes: [{' anymore (not an array anymore)
        ticks: {
          color: "green", // not 'fontColor:' anymore
          // fontSize: 18,
          font: {
            size: 18, // 'size' now within object 'font {}'
          },
          stepSize: 1,
          beginAtZero: true
        }
      },
      x: {  // not 'xAxes: [{' anymore (not an array anymore)
        ticks: {
          color: "purple",  // not 'fontColor:' anymore
          //fontSize: 14,
          font: {
            size: 14 // 'size' now within object 'font {}'
          },
          stepSize: 1,
          beginAtZero: true
        }
      }
    }
  }
});

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
  <!-- gets you the latest version of Chart.js, now at v3.3.2 -->

<div>
  <canvas id="barChart" height="140"></canvas>
</div>

Inside the dataset, assign a color to the attribute borderColor.

data: {
    labels: [1, 2, 3, 4, 5],
    datasets: [
        {
            data: temp,
            label: "Temperature",
            backgroundColor: "rgba(219, 0, 0, 1)",
            borderColor: "rgba(219, 0, 0, 1)",
            fill: false
        },
        {
            data:rh,
            label: "Humidity",
            fill: false
        },
        {
            data:lux,
            label: "Luminosity",
            fill:false
        }
    ]
}

I've been working with a line graph and backgroundColor sets the color of the specific points on the line graph, and then borderColor sets the color of the line itself as well as the legend label associated with that dataset.