Javascript Chart.js基于标签的条形图加载数据

我正在使用Chart.js制作条形图。我需要在条形图中显示12个月的数据。所以在2016年，我只有2月、3月和4月的数据。在标签中，im加载所有12个月，例如2016年1月至2016年12月

var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
 "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"
    ];
    var startmonth = ["Dec", "Nov", "Oct", "Sep", "Aug", "Jul",
"Jun", "May", "Apr", "Mar", "Feb", "Jan"
    ];
var itemMonths = [];
 var start;
        var end = 11;
        var month;
        var year;

        var date = new Date();

        month = date.getMonth();
        year = parseInt(Result[0].yearfromdb); //getting createddate year from db
        start = 0;
        for (var i = 0; i < 12; i++) {
            var months = monthNames[start];
            itemMonths.push(months + year);
            start = start + 1;
            if (start == 12) {
                start = 0;
                year = year + 1;
            }
        }

 for (var i in Result)
        {


            itemCountList.push( Result[i].Counts );// Result is List from Db contains Feb,mar and apr total counts..


        }

 var mybarChart = null;
        var ctx = document.getElementById("mybarChart");

         mybarChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: itemMonths
                ,
                datasets: [{
                    label: 'Total Count',
                    backgroundColor: "#26B99A",
                    data: itemCountList
                }]
            },

            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true,
                            steps: 10,
                            stepValue: 5,
                            max: 100

                        }
                    }],
                    xAxes: [{

                        steps: 10,
                        stepValue: 5,
                        max: 12
                    }]

                }
            }
         });

var monthNames=[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”，
“七月”、“八月”、“九月”、“十月”、“十一月”、“十二月”
];
var startmonth=[“十二月”、“十一月”、“十月”、“九月”、“八月”、“七月”，
“六月”、“五月”、“四月”、“三月”、“二月”、“一月”
];
var itemMonths=[]；
var启动；
var-end=11；
var月；
var年；
变量日期=新日期（）；
month=date.getMonth（）；
year=parseInt（结果[0].yearfromdb）//从数据库获取createddate年
开始=0；
对于（变量i=0；i<12；i++）{
var月数=月数[开始]；
itemMonths.push（月+年）；
开始=开始+1；
如果（开始==12）{
开始=0；
年份=年份+1；
}
}
for（结果中的var i）
{
itemCountList.push（结果[i].Counts）；//结果是来自Db的列表包含二月、三月和四月的总计数。。
}
var mybarChart=null；
var ctx=document.getElementById（“mybarChart”）；
mybarChart=新图表（ctx{
类型：'bar'，
数据：{
标签：项目月份
,
数据集：[{
标签：“总计数”，
背景色：“26B99A”，
数据：itemCountList
}]
},
选项：{
比例：{
雅克斯：[{
滴答声：{
贝吉纳泽罗：是的，
步骤：10，
步长值：5，
最高：100
}
}],
xAxes：[{
步骤：10，
步长值：5，
最高：12
}]
}
}
});

我的问题是，数据是从一月，二月，三月加载的，而不是二月，三月，四月。。。。

---

如何做到这一点？请帮助我……

您的起点取决于年份，因此：

year = parseInt(Result[0].yearfromdb); //getting createddate year from db
start = (year === 2016? 1 : 0);

---

试试这个…

代码的问题是数据点的计数不等于标签的计数。由于此图表正在从x轴标签开始的右侧绘制可用的3个数据点

要解决此问题，可以使数据点计数与数据标签计数相同

试试这个，在这里我检查数据点是否在结果数组id中的给定月份可用是，然后在数据点数组中插入该值，否则插入0值

for (var i = 0; i < 12; i++) {
   var months = monthNames[start];
   var monthValue = 0;
   itemMonths.push(months + year);
   start = start + 1;
   if (start == 12) {
     start = 0;
     year = year + 1;
   }

   var dataObj = $.grep(Result, function(a) {
     return a.Months == months
   })[0];
   var monthValue = dataObj !== undefined ? dataObj.Counts : 0;
   itemCountList.push(monthValue)
 }

for（变量i=0；i<12；i++）{
var月数=月数[开始]；
var-monthValue=0；
itemMonths.push（月+年）；
开始=开始+1；
如果（开始==12）{
开始=0；
年份=年份+1；
}
var dataObj=$.grep（结果，函数（a）{
返回a.月数==月数
})[0];
var monthValue=dataObj！==未定义？dataObj.计数：0；
itemCountList.push（monthValue）
}

---

您能为您的问题创建一个有效的示例吗？小提琴不起作用，您必须提供结果值才能使其起作用这不是本年度的问题。。我有2016年2月、2016年3月和2016年4月的数据。但它显示2016年1月、2016年2月和2016年3月，因为我提供了数据：itemCountList，其中itemCountList从数据库推送数据

for (var i = 0; i < 12; i++) {
   var months = monthNames[start];
   var monthValue = 0;
   itemMonths.push(months + year);
   start = start + 1;
   if (start == 12) {
     start = 0;
     year = year + 1;
   }

   var dataObj = $.grep(Result, function(a) {
     return a.Months == months
   })[0];
   var monthValue = dataObj !== undefined ? dataObj.Counts : 0;
   itemCountList.push(monthValue)
 }