折线图是在Chart.js中的第一个点之前绘制的

时间:2016-07-28 14:39:17

标签: chart.js linechart

我试图画一条线加条形图。 每当我尝试绘制折线图时(我尝试仅绘制折线图,​​同样的错误),在第一个点之前绘制一条线:

Line Chart

这是我第一次尝试使用Chart.js 2.0时,我画的其他图表看起来很棒,除了这个...有什么想法吗?

代码:

function Data() {
    $scope.barChartData = {
        labels: $scope.mesesLabels,
        datasets: [
            {
                type: 'bar',
                label: "" + myDate.getFullYear() - 1,
                backgroundColor: "#5799c7",
                data: $scope.infoAnoAnterior,
                borderColor: 'white',
                borderWidth: 2,
            },
            {
                type: 'bar',
                label: "" + myDate.getFullYear(),
                backgroundColor: "#ff7c40",
                data: $scope.infoAnoAtual,
            },
            {
                type: 'line',
                label: 'Média entre anos',
                backgroundColor: "rgba(220,20,20,0)",
                data: $scope.mediaEntreAnos,
                borderColor: 'red',
                borderWidth: 2,
                pointBorderColor: 'black',
                pointBackgroundColor: 'black'
            }, ]
    };
    drawChart();
}

function drawChart(){ 
    var ctx = document.getElementById("base").getContext("2d");
    window.myBar = new Chart(ctx, {
        type: 'bar',
        data: $scope.barChartData,
        options: {
            responsive: true,
            title: {
                display: true,
                text: 'Chart.js Combo Bar Line Chart'
            },
            legend: {
                display: true,
                labels: {
                    fontColor: 'rgb(255, 99, 132)'
                }
            },                
        }
    });
}

3 个答案:

答案 0 :(得分:1)

输入值是否有问题,而不是图表选项?即一些重复的值。

答案 1 :(得分:0)

要获得预期结果,请在下面添加选项

scaleStartValue: 0

答案 2 :(得分:0)

我在我的项目中添加了最新版本的chart.js(2.2.1)并且它有效,不知道为什么2.0没有,但感谢您的时间!