Jquery Chart.js图例样式

我们一直在探索更改chart.js legend样式的方法，因为默认样式不适合我们正在创建的web应用程序的样式/设计。我们对这个图书馆还很陌生，文档似乎没有透露多少信息

我们唯一能改变的是图例中盒子的大小。我们所寻找的，也许不是传说中的钥匙是矩形/正方形，或者显示为一条线，中间有一个点，或者只是一条线？

以下是我们的选项设置方式：

  labels: {
    fontColor: 'rgb(0,0,0)',
    boxWidth: 10,
    padding: 20
  },

我们想知道是否有一种在标签选项中进行这些更改的简单方法

更新

以下是当前设置的：

我们希望标签是一个正方形，而不是一条单线，中间可能有一个点。或者至少是一行

---

我的一个问题是，如果图例被更改或定制，它是否会失去切换功能？

在chart.js中，可以进行的图例配置很少。你的问题基本上都提到了。之所以如此，是因为默认图例直接在canvas对象中呈现，并且由于canvas API并不简单，因此很难对其进行参数化

尽管如此，chart.js的家伙们意识到我们需要更大的灵活性，他们提供了一种机制，在图表范围之外创建/设置您的图例。您可以使用

legendCallback

选项创建一个函数，为图例返回HTML/CSS，然后调用

.generateLegend（）

prorotype方法来呈现它

使用这种方法，您可以将图例放置在HTML页面的任何位置，并使用普通的旧HTML/CSS对其进行样式设置

下面是一个例子，展示了如何做我所描述的事情。我对CSS不是很在行，所以我将把框改成行或者任何你想要的东西留给你

需要注意的一点是，使用外部图例会破坏图例与图表交互的能力。你必须在自己身上建立这一点。这可能有点复杂，取决于你想做什么，但没有什么是不可能的

下面是一个外部自定义图例，显示了一些图表交互。这里我们突出显示图例项鼠标上方的饼图区域。请参阅（您实际要求的：D）以了解如何操作数据集切换

---

你应该能够结合所有这些例子来建立你的梦想自定义外部传奇！如果您有具体问题，请告诉我。

您能展示一下您拥有的和想要的吗？当然，请告诉我，我会更新问题。@Sebastian请查看update@Sebastian你看到我更新的帖子了吗？