Chart.js: прямые вместо кривых

Question

Я использую Chart.JS для построения набора данных,

Однако я получил плавный эффект!

Вот кривая у меня есть:

Вот мой код:

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); 

} 

Как я могу иметь прямые вместо кривых?

Спасибо

Answer 1

Согласно documentation on chartjs.org

вы можете установить «» Кривая Безье в настройках и передать его в при создании диаграммы.

bezierCurve: false 

например:

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

Обновление для версии 2

Согласно обновленной документации по конфигурации линии в глобальных опций

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

например:

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

А также непосредственно в структуре набора данных, установив lineTension на 0 (ноль).

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. 

Ниже приведен пример объекта данных с использованием этих атрибутов.

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

Answer 2

Вы можете использовать опцию lineTension для установки нужной кривой. Установите 0 для прямых линий. Вы можете указать число между 0-1

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