这个js是不是有语法错误?循环里面的东西在运行的时候没有执行,求大佬指点。
问题描述:
如题, 我想在一个Chart里面画出三个波形图,就将三个波形的数据都放在一个数组myDatasets里面。然后再赋值给Chart,但运行的时候发现整个循环里面所有的东西都没运行,包括
console.log
也没运行,但控制台又没报错,实在一头雾水,是不是我语法哪里有问题?求大佬帮帮忙QAQ
这是我整个函数↓
function drawWaveform(datas){
console.log("绘制开始。。。");
var lineChart = $("#waveform");
console.log(datas);
var xs=[];
var allYs=[];
var myDatasets=[];
var ys=[];
var k=0;
for(;k<datas.length;k++){
//【从这里开始就没运行了】
console.log(k);
var points=datas[k].points;
console.log(points);
for(var i = 0;i<points.length;i++){
if(i==0){
xs.push(points[i].x);
}
ys.push(points[i].y);
}
allYs.push(ys);
var color="";
if(datas[k].phrase=="A"){
color="#FFD700";//gold(yellow)
var curDataset={
label: datas[k].phrase,
fill: false,
lineTension: 0.1,
backgroundColor: "#fff",
borderColor: color,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "#fff",//white
pointBackgroundColor: "#141E41",//black
pointBorderWidth: 1,
pointHoverRadius: 10,
pointHoverBackgroundColor: "#FC2055",//red
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 1,
pointRadius: 0,
pointHitRadius: 10,
data: ys,
spanGaps: false
};
this.myDatasets.push(curDataset);
}
if(datas[k].phrase=="B"){
color="#047bf8";//blue
var curDataset={
label: datas[k].phrase,
fill: false,
lineTension: 0.1,
backgroundColor: "#fff",
borderColor: color,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "#fff",//white
pointBackgroundColor: "#141E41",//black
pointBorderWidth: 1,
pointHoverRadius: 10,
pointHoverBackgroundColor: "#FC2055",//red
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 1,
pointRadius: 0,
pointHitRadius: 10,
data: ys,
spanGaps: false
};
this.myDatasets.push(curDataset);
}
if(datas[k].phrase=="C"){
color="#FC2055";//red
var curDataset={
label: datas[k].phrase,
fill: false,
lineTension: 0.1,
backgroundColor: "#fff",
borderColor: color,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "#fff",//white
pointBackgroundColor: "#141E41",//black
pointBorderWidth: 1,
pointHoverRadius: 10,
pointHoverBackgroundColor: "#FC2055",//red
pointHoverBorderColor: "#fff",
pointHoverBorderWidth: 1,
pointRadius: 0,
pointHitRadius: 10,
data: ys,
spanGaps: false
};
this.myDatasets.push(curDataset);
}
ys=[];
//【到这里结束】
}
//【这里开始有结果】
console.log(myDatasets);
// line chart data
var lineData = {
labels: xs,
datasets: myDatasets
};
// line chart init
var myLineChart = new Chart(lineChart, {
type: 'line',
data: lineData,
options: {
legend: {
display: false
},
scales: {
xAxes: [{
ticks: {
fontSize: '11',
fontColor: '#969da5'
},
gridLines: {
color: 'rgba(0,0,0,0.05)',
zeroLineColor: 'rgba(0,0,0,0.05)'
}
}],
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
max: 65
}
}]
}
}
});
console.log("绘制结束");
}
在这个函数的ajax里面调用的这个函数↓
function show3(id1,id2,id3) {
console.log("show3");
var ids=[id1,id2,id3];
var flag = false; //标识,表示页面上数据还未处理完成
var datas=[];
console.log(ids);
for(var i=0;i<3;i++){
//console.log(ids);
var curid=ids[i];
$.ajax({
type : "get",
url : "observe/getImage",
data : {
ID : curid
},
beforeSend: function () {
ShowDiv();
},
complete: function () {
HiddenDiv();
},
success : function(data) {
console.log(data)
datas.push(data);
}
});
}
console.log(datas);
//绘制波形图
//drawWaveform(data.points);
drawWaveform(datas);//【**在这里调用的**】
$("#closeDivBtn").html("<input class=\"mr-2 mb-2 btn btn-primary btn-lg\" type=\"button\" value=\"关闭\" onclick=\"CloseDiv('MyDiv','fade')\">");
AlertDiv('MyDiv','fade');
}
答
打印一下datas是不是没有值?
答
有些括号或者引号没有成对会导致这种情况,通常是多加几个console.log()看是在哪块中断的,把可能有错的代码块剪切出去,逐渐加入,缩小可能有错的范围。