0

这是我的 jsfiddle 解释我面临的问题。我想基本上传递选项对象（以禁用填充和贝塞尔曲线），就像我在旧版本中所做的那样......

https://jsfiddle.net/xjdvngwe/

基本上我想在创建图表时实现将选项传递给图表函数

var options = { fill:false,tension:0, lineTension :0.1};
var chart_testChart = new Chart.Line(ctx, 
    { 
        data: data, 
        options: options 
    });

在最新版本 2.1.6 中，我无法让它工作

如果我像这样传递它们，它们可以正常工作，但我正在寻找一种将它们作为选项对象传递的方法

var data = {
labels: ["January", "February", "March", "April", "May", "June", "July"],
datasets: [
    {
        label: "My First dataset",
        fill: false,
        lineTension: 0.1,
4

1 回答 1

1

这是因为您误解了图表的构建方式：

您认为fill和tension属性都直接位于选项的根目录中，但它们实际上位于options.element.line.

有关更多信息，请查看有关元素配置的 Chart.js 文档（在您的情况下滚动直到行配置）。

但小心点 ！！不要混淆：

  • 通过编辑传递给图表数据的数据集来编辑一个元素（正如您在问题的第二部分中所做的那样）：

    datasets: [
{
    label: "My First dataset",
    fill: false,
    lineTension: 0.1,
    // ...
}]

  • 通过编辑图表选项来编辑相同类型的所有元素（此处为折线图）：

    var options = { elements: { line: { /*options */ } } };

    正如我在上面给出的文档中所述：

    可以为四种不同类型的元素配置选项；弧、线、点和矩形。设置后，这些选项适用于该类型的所有对象，除非被附加到 dataset 的配置特别覆盖。

因此，在直接在选项中编辑这些属性之前，请确保您确实想要编辑所有折线图。

现在，如果您仍想在选项中进行编辑，则必须options像这样构建您的 var：

var options = { elements: { line: { fill: false, tension: 0.1 } } };
var chart_testChart = new Chart.Line(ctx, 
{ 
    data: data, 
    options: options 
});

如果您想查看结果，这是一个工作小提琴。

于 2016-07-14T15:10:40.110 回答