2016-07-06 67 views
0

这是我的jsfiddle,解释我面临的问题。我想基本上通过选择对象(禁用填充和贝塞尔曲线),我就像在旧版本做了...将全局选项传递给2.1.6/Chart.js中的折线图

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, 

回答

0

这是因为你误解了这个图表是如何构建的:

你假设filltension属性都是直接在选项的根源,但它们实际上是在options.element.line

欲了解更多信息,请有关element configuration的chart.js之DOC(滚动,直到行配置你的情况)。


但要小心!不要混淆:

  • 编辑一个元素(如你管理你的问题的第二部分做的)编辑传递给图表数据的数据集:

    datasets: [ 
    { 
        label: "My First dataset", 
        fill: false, 
        lineTension: 0.1, 
        // ... 
    }] 
    
  • 编辑的所有相同类型的元素(这里,折线图)通过编辑图表选择:

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

    documentation说明我上面给出:

    选项可以被配置为四种不同类型的元件;弧线,点和矩形。 设置后,这些选项将应用于该类型的所有对象,除非被数据集附加的配置明确覆盖。

所以一定要确保你真正想要直接在选项编辑这些属性之前编辑所有的折线图。现在


如果你仍然想在选项编辑,你将不得不建立自己的 options VAR是这样的:

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

这里是一个working fiddle,如果你想看到的结果。

+1

感谢您的详细解释!我无法通过查看现有文档轻易推断出这一点 –

+0

@PuneetGupta文档中有很多信息,但有时候,很难找到您要查找的内容..很高兴帮助:) – tektiv