图表js仅在迷你图上显示2个数据点

时间:2018-05-02 01:07:28

标签: chart.js

图表js仅显示具有24个数据点的迷你图样式图表上的2个数据点。这是图表大小问题吗?我有另一个基于相同数据的图表,工作正常......这是一个工具提示问题还是一个大小问题?我似乎无法显示所有数据。我尝试了许多配置,但他的问题仍然存在。谢谢!

enter image description here enter image description here

        var style = {
        maintainAspectRatio: false,
        legend: {
            display: false
        },

        tooltips: {
            bodySpacing: 1,
            mode: "nearest",
            intersect: 0,
            position: "nearest",
            xPadding: 2,
            yPadding: 2,
            caretPadding: 5,

        },
        hover: {mode: null},

        responsive: false,

        scales: {
            yAxes: [{
                ticks: {
            display: false
        },
                gridLines: 0,
                gridLines: {
                    zeroLineColor: "transparent",
                    drawTicks: false,
                    display: false,
                    drawBorder: false
                }
            }],
            xAxes: [{
                display: 0,
                gridLines: 0,
                ticks: {
                    display: false
                },
                gridLines: {
                    zeroLineColor: "transparent",
                    drawTicks: false,
                    display: false,
                    drawBorder: false
                }
            }]
        },
        layout: {
            padding: {left: 10, right: 10, top: 10, bottom: 10}
        }
    };

    var config = {

        type: 'line',
        responsive: true,

        data: {
            datasets: [{
                label: "",
                borderColor: "#80b6f4",
                pointBorderColor: "#FFF",
                pointBackgroundColor: "#18ce0f",
                pointBorderWidth: 1,
                pointHoverRadius: 2,
                pointHoverBorderWidth: 1,
                pointRadius: 1,
                fill: true,
                backgroundColor:gradientFill,
                borderWidth: 2,
                scaleFontColor: "#FFF",
                fontColor: "#FFF",
                data: cleandata,
                drawBorder: true,

            }]
        },
        options: {

            layout: {
                padding: {
                left: 5,
                right: 5,
                top:5,
                bottom: 5
        }
    }
            },
        options: style
    }
    showChart = new Chart(ctx , config);
    });

1 个答案:

答案 0 :(得分:1)

我发现了这个问题。我没有正确传递我的标签数据。应该这样传递:

data: {
       labels: labels,
        datasets: [{ 

等...