Chart.js传奇风格

Question

我们一直在探索更改chart.js传奇风格的方法，因为默认不符合我们创建的Web应用的风格/设计。我们对这个librasry很感兴趣，而且这个文档似乎没有多少好处。

我们唯一能够改变的就是图例中框的大小。我们正在寻找的可能是，而不是传说中的关键是矩形/正方形，还是显示为中间有一个点或只有一行的线？

下面是我们的选项设置：

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

我们想知道，如果有使标签选项中这些变化的一个简单的方法是什么？

UPDATE

这里是，这是当前设置：

愿我们的标贴，而不是成为一个正方形的，但在中间也许一个点一个单行？或者至少一条线。

我从这个问题得到的一个问题是，如果图例被更改或定制，它会失去切换的能力吗？

Answer 1

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

尽管如此，chart.js家伙意识到我们会希望有更多的灵活性，他们提供了一种机制来创建/设计图表范围以外的图例。您可以使用legendCallback选项来创建一个函数，为您的图例返回HTML/CSS，然后调用.generateLegend() prorotype方法来渲染它。

使用这种方法，您可以将您的图例置于您的HTML页面的任何位置并对其进行设计，但您认为它适合于普通的旧HTML/CSS。

这是一个example，它显示了如何做我所描述的。我对CSS不太了解，所以我会把它交给你来改变方框，或者你想要的东西。

需要注意的一件事是，使用外部图例会破坏图例与图表交互的功能。你将不得不自己建立这个。取决于你想做什么，它可能有点复杂，但没有什么是不可能的。

这是外部自定义图例的another example，显示一些图表交互。在这里，我们将突出显示图例项目mouseover上的饼图区域。请参阅此other question（实际上由您问：D）以查看如何操纵数据集切换。

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