Chart.js: đường thẳng thay vì đường cong

Tôi đang sử dụng Chart.JS để vẽ một tập dữ liệu,

Tuy nhiên, tôi đã có một hiệu ứng mượt mà!

Đây là đường cong tôi đã có:

Đây là mã của tôi:

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

}

Làm thế nào tôi có thể có đường thẳng thay vì đường cong?

Cảm ơn bạn

Giải pháp cho Phiên bản 1 (phiên bản biểu đồ cũ)

Theo tài liệu trên chartjs.org

bạn có thể đặt 'bezierCurve' trong các tùy chọn và chuyển nó vào khi bạn tạo biểu đồ.

bezierCurve: false

ví dụ:

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

Cập nhật cho phiên bản 2

Theo tài liệu cập nhật về Cấu hình dòng trong các tùy chọn chung

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

ví dụ:

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

Và cũng trực tiếp trong Cấu trúc tập dữ liệu bằng cách đặt lineTensionthành 0 (không).

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.

Một đối tượng dữ liệu mẫu sử dụng các thuộc tính này được hiển thị bên dưới.

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

Bạn có thể sử dụng tùy chọn lineTension để đặt đường cong mong muốn. Đặt 0 cho các đoạn thẳng. Bạn có thể đưa ra một số từ 0-1

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

Tôi đã sử dụng lineTension để thiết lập độ mịn của đường cong.

Từ tài liệu : lineTension nhận được một số, độ căng đường cong Bezier của đường. Đặt thành 0 để vẽ đường thẳng. Tùy chọn này bị bỏ qua nếu sử dụng phép nội suy khối đơn điệu.

Chỉ cần đảm bảo kiểm tra với các giá trị khác nhau mà bạn muốn đường thẳng.

Ví dụ:

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

  ]
};

Tôi nghĩ rằng nó đã được cập nhật lên lineTension. Kiểm tra tài liệu .