Chart.js: des lignes droites au lieu de courbes

J'utilise Chart.JS pour tracer un ensemble de données,

Cependant j'ai eu un effet lisse!

Voici la courbe que j'ai:

Voici mon code:

function plotChart(data, labels) {

    var lineChartData = {
        "datasets": [{
            "data": data,
            "pointStrokeColor": "#fff",
            "fillColor": "rgba(220,220,220,0.5)",
            "pointColor": "rgba(220,220,220,1)",
            "strokeColor": "rgba(220,220,220,1)"
        }],
        "labels": labels
    };

    var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(lineChartData);

}

Comment puis-je avoir des lignes droites au lieu de courbes?

Je vous remercie

Solution pour la version 1 (ancienne version des graphiques)

Selon la documentation sur chartjs.org

vous pouvez définir le 'bezierCurve' dans les options et le transmettre lorsque vous créez le graphique.

bezierCurve: false

par exemple:

var options = {
    //Boolean - Whether the line is curved between points
    bezierCurve : false
};
var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(lineChartData, options);

Mise à jour pour la version 2

Selon la documentation mise à jour pour la configuration de ligne dans les options globales

Name        Type    Default Description
tension     Number  0.4     Default bezier curve tension. Set to 0 for no bezier curves.

par exemple:

var options = {
    elements: {
        line: {
            tension: 0
        }
    }
};

Et aussi directement dans la structure du jeu de données en définissant lineTensionsur 0 (zéro).

Property        Type    Usage
lineTension     Number  Bezier curve tension of the line. Set to 0 to draw straightlines. 
                        This option is ignored if monotone cubic interpolation is used. 
                        Note This was renamed from 'tension' but the old name still works.

Un exemple d'objet de données utilisant ces attributs est illustré ci-dessous.

var lineChartData = {
    labels: labels,
    datasets: [
        {
            label: "My First dataset",
            lineTension: 0,           
            data: data,
        }
    ]
};

Vous pouvez utiliser l'option lineTension pour définir la courbe souhaitée. Définissez 0 pour les lignes droites. Vous pouvez donner un nombre entre 0-1

data: {
    datasets: [{
        lineTension: 0
    }]
}

J'ai utilisé lineTension pour définir la douceur de la courbe.

À partir de la documentation : lineTension reçoit un nombre, la tension de la courbe de Bézier de la ligne. Réglez sur 0 pour tracer des lignes droites. Cette option est ignorée si une interpolation cubique monotone est utilisée.

Assurez-vous simplement de tester avec différentes valeurs la fluidité souhaitée de la ligne.

Par exemple:

var data = {
  labels: ["Jan", "Feb", "Mar"],
  datasets: [{
      label: "Label 1",
      lineTension: 0.2
    }, {
      label: "Stock B",
      lineTension: 0.2
    }

  ]
};

Je pense qu'il a été mis à jour lineTension. Consultez les documents .