title: Chart.js - Styling Legend
body: <p>I'm making a chart with chart.js and I'm trying to figure out how I can change the label/legend styling.
  I want to remove the rectangle part and instead use a circle. I've read that you can make your custom legend (using legendCallback), but for the life of me I cannot figure out how to do it. This is how my chart looks now - <a href="https://i.stack.imgur.com/9vAJJ.jpg" rel="noreferrer">image</a>.</p>
  
  <p>This is my HTML:</p>
  
  <pre><code>&lt;div class="container"&gt;
  &lt;canvas id="myChart"&gt;&lt;/canvas&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And this is my JS:</p>
  
  <pre><code>var ctx = document.getElementById("myChart");
  var myChart = new Chart(ctx, {
      type: 'line',
      data: {
          labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
          datasets: [{
              label: 'Link One',
              data: [1, 2, 3, 2, 1, 1.5, 1],
              backgroundColor: [
                  '#D3E4F3'
              ],
              borderColor: [
                  '#D3E4F3',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 1
          }]
      },
      options: {
          legend: {
              display: true,
            position: 'bottom',
              labels: {
                  fontColor: '#333',
              }
          }
  }
  });
  </code></pre>
  
  <p>I'm new to JS in general, so please be as specific as possible with your answers. Thank you so much!</p>