更改图例框大纲Chart.js 2

Question

I'm trying to remove the stroke color from the legend generated by ChartJS, but I can't quite seem to understand what the documentation is telling me.

My current code looks like this:

legend: {
  position: 'bottom',
    labels: {
      generateLabels: function() {
        return {
          strokeStyle: "black",
        }
      }
    }
  }

Though I have tried this:

generateLabels: {
  strokeStyle: "black",
}

I'm setting the stroke style to "black" to see if I'm having any effect, but I'm not even sure if that's what I'm supposed to be doing. I would think I could set it to none.

Edit

Here is the code for my full object:

  var ctx = $('#chart'); var data = { labels: ["1","2","3","4","5","6","7"], datasets: [{ data: [22,19,17,15,10,9,8], backgroundColor: [ '#df4344', '#fc9627', '#fcd949', '#d4d81e', '#6dc7ba', '#24a38e', '#263a7e', '#5050b2', '#4f7ec1', '#96afe2', ], borderColor: ["black"], borderWidth: 2 }] }; var wheel = new Chart(ctx, { type: "doughnut", data: data, options: { maintainAspectRatio: false, responsive: true, tooltips: false, cutoutPercentage: 60, } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script> <canvas id="chart"></canvas> 

But now that I run it here, it seems to be working. So I'm not sure what's wrong anymore.

Answer 1

To remove the stroke from legend, you need to set borderWidth property to 0 for your dataset, like so ...

datasets: [{
   borderWidth: 0,
   ...
}]

ᴡᴏʀᴋɪɴɢ ᴇxᴀᴍᴘʟᴇ ⧩

 var ctx = c.getContext('2d'); var chart = new Chart(ctx, { type: 'line', data: { labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May'], datasets: [{ label: 'Statistics', data: [3, 1, 2, 5, 4], backgroundColor: 'rgba(0, 119, 204, 0.1)', borderColor: 'rgba(0, 119, 204, 0.8)', borderWidth: 0 //<-- set this }] }, options: { scales: { yAxes: [{ ticks: { beginAtZero: true } }] } } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script> <canvas id="c"></canvas>