Chart.js图例定制

我的chart.js的配置有点奇怪，因为输入的数据和线条的颜色。然而，我想知道是否有人能告诉我如何定制传奇：

$(document).ready(function(){ 

$.ajax({ 
url : "../acredash/teamData.php", 
timeout: 4000,
type : "GET", 
success :function(data){ 
console.log(data); 


var chartata = { 
labels: [ 
"Strategic Development and Ownership", 
"Driving change through others", 
"Exec Disposition", 
"Commercial Acumen", 
"Develops High Performance Teams", 
"Innovation and risk taking", 
"Global Leadership", 
"Industry Leader" 
]}; 

var ctx = $("#mycanvas"); 

var config = { 
    type: 'radar', 
    data: chartata, 
    animationEasing: 'linear',
        options: {
         legend: {
            display: true,
            position: 'bottom'
        },
         tooltips: {
            enabled: true
        },
        scale: {
            ticks: {
                fontSize: 15,
                beginAtZero: true,
                stepSize: 1
            }
        } 

    },
}, 

LineGraph = new Chart(ctx, config); 

var colorArray = [
    ["#7149a5", false],
    ["#57B6DD", false],
    ["#36bfbf", false],
    ["#69bd45", false],
    ['#9adfdf', false],
    ['#c6b6db' ,false],
    ["#5481B1", false],
    ['#8d6db7', false],
    ['#d2ebc7', false],
    ["#6168AC", false]
];


for (var i in data) { 
    tmpscore=[]; 
    tmpscore.push(data[i].score_1); 
    tmpscore.push(data[i].score_2); 
    tmpscore.push(data[i].score_3); 
    tmpscore.push(data[i].score_4); 
    tmpscore.push(data[i].score_5); 
    tmpscore.push(data[i].score_6); 
    tmpscore.push(data[i].score_7); 
    tmpscore.push(data[i].score_8); 

    var color, done = false;
    while (!done) {
        var test = colorArray[parseInt(Math.random() * 10)];
        if (!test[1]) {
            color = test[0];
            colorArray[colorArray.indexOf(test)][1] = true;
            done = !done;
        }
    }


newDataset = { 
    label: data[i].firstName+' '+data[i].lastName, 
     borderColor: color,
    backgroundColor: "rgba(0,0,0,0)", 
    data: tmpscore, 
}; 

    config.data.datasets.push(newDataset); 

} 

LineGraph.update(); 
},  
}); 
});

因为我的图表是如何生成的，所以我环顾四周，运气不太好。它只是使用了默认的图例和它的混乱。我只想控制它。

步骤1： 为选项上的图例设置回调

legendCallback: function(chart) {
        var legendHtml = [];
        legendHtml.push('<ul>');
        var item = chart.data.datasets[0];
        for (var i=0; i < item.data.length; i++) {
            legendHtml.push('<li>');
            legendHtml.push('<span></span>');//add what ever you want :-p
            legendHtml.push('<span class="chart-legend-label-text">' + chart.data.labels[i]+'</span>');
            legendHtml.push('</li>');
        }

        legendHtml.push('</ul>');
        return legendHtml.join("");
    },legend:false,

步骤3：

---

你想干什么就干什么……

回答这个问题有点困难。我假设您已在以下位置签出选项：。你还想要什么？@mrEthol Yea manI一直在试着挑选我需要的东西，但iv没有这样的运气，这真是一个难题！

<div id="my-legend-con" class="legend-con"></div>

$('#my-legend-con').html(myChartName.generateLegend());