啟用“showLine”后無法對散點圖使用線條張力

Question

我正在嘗試使用 vue-chartjs 繪制時間散點圖 plot，但無法使線張力正常工作。 如果我將數據集的張力選項設置為除 0 以外的任何值，該行就會消失。

圖表數據和選項（現在只是一些虛擬數據）：

    const chartOptions = {
        responsive: true,
        maintainAspectRatio: true,
        plugins: {
            legend: false
        }
    };

    const chartData = ref({
        datasets: [
            {
                data: [
                    { x: 0, y: 5 },
                    { x: 3, y: 4 },
                    { x: 5, y: 7 },
                    { x: 8, y: 13 },
                    { x: 13, y: 6 },
                    { x: 18, y: 2 },
                    { x: 25, y: 11 },
                ],
                backgroundColor: "#ED1369",
                borderColor: "#ED1369",
                showLine: true,
                tension: 0,
                pointRadius: 3.5,
                pointHoverRadius: 3.5,
                borderWidth: 2
            }
        ]
    });

沒有張力的結果（張力：0）：圖表顯示沒有張力的線條

緊張的結果（緊張> 0）：圖表破裂並且不再顯示線條

我試過同時使用“tension”和“lineTension”選項，以及“cubicInterpolationMode”選項。 我還嘗試了這些選項的各種組合。 我已經測試並發現 Chart.js 確實支持散點圖上的曲線。

Answer 1

事實證明您必須注冊Filler組件。

https://github.com/apertureless/vue-chartjs/issues/988