从 chart.js 图例中删除项目符号答案

【问题标题】：Remove bullet points from chart.js legend从 chart.js 图例中删除项目符号
【发布时间】：2015-09-04 12:40:07
【问题描述】：

我按照this 示例使用chart.js。

我的图例在每个图例项旁边显示项目符号，我不知道为什么。出现在多个浏览器中。这是我得到的图像：

我尝试添加“list-style-type: none;”进入css，但这对我没有任何影响。

有什么想法吗？ JSFiddle代码如下：

**html**
<div style="width: 100%; height: 100%;">
<canvas id="myChart" style="width: 100%; height: auto;"></canvas>
</div>
<div id="js-legend" class="chart-legend"></div>

**js**
var data = [
{
value: 61,
color: "#09355C",
label: "Label 1"
}, {
value: 11,
color: "#CBCBCB",
label: "Label 2"
}, {
value: 28,
color: "#B61B12",
label: "Label 3"
}];

var options = {
segmentShowStroke: false,
animateRotate: true,
animateScale: false,
percentageInnerCutout: 50,
tooltipTemplate: "<%= value %>%"
}

var ctx = document.getElementById("myChart").getContext("2d");
var myChart = new Chart(ctx).Doughnut(data, options);
document.getElementById('js-legend').innerHTML = myChart.generateLegend();

**css**
.chart-legend li span{
display: inline-block;
width: 12px;
height: 12px;
margin-right: 5px;
}

【问题讨论】：

我在您的 jsfiddle 演示中看不到任何项目符号。你能给我截图看看是什么问题吗？
谢谢，imgur.com/9HnPOsW
您使用的是哪种浏览器？似乎它的行为与我们的不同（适用于最新版本的 Chrome）。你试过黑客 ul { list-style-type:none !important; } ?

标签： css chart.js

【解决方案1】：

您需要将list-style-type: none; 添加到li 元素，即类似

.chart-legend li {
    list-style-type: none;
}

您当前的 CSS 规则集以 .chart-legend li span 为目标 - 添加 list-style-type: none; 将无济于事。

【讨论】：

传奇，非常感谢，这正是我所需要的：D