Char.js 显示图表异常

利用ajax动态获取值，绘制环形图。
后端代码

@RequestMapping("adm/missionAnalysis/getHeadCnt")
    public String getHeadCnt(Model model){
        String sql="select c_head as type,count(*) as number from c_uv_team_uv group by c_head";
        List<?> result= jt.queryForList(sql);
        log.debug("result:{}",result);
        model.addAttribute("result",result);
        return "json";
    }

前端代码

function doChart2(){
        var ctx2=document.getElementById("donutChart").getContext('2d');
        $.ajax({
            url:"getHeadCnt",
            type:'get',
            datatype:'json'
        }).done(function (result){
           var labels=[],data=[];
           console.log(result);
           result.result.forEach(item=>{
              if(item.type=='0'){
                  labels.push("非车头");
              }else{
                  labels.push("车头");
              }
              data.push(item.number);
           });
           console.log(labels);
           console.log(data);
           var tempData={
              labels:labels,
               datasets: [{
                  label: "类型占比",
                   backgroundColor: ['#f56954','#132bcb'],
               }],
           };
           var chart2=new Chart(ctx2,{
              type:'doughnut',
               data:tempData,
               options: {
                   maintainAspectRatio: true,
                   responsive: true,
               }
           });
        });
    }

后端与前端都获得了正确的数据，

可是前端页面并没有获得环形图

有人可以解释一下吗