2
다음은 Phonegap 프로젝트에서 사용하고있는 코드입니다.Uncaught TypeError : 정의되지 않은 (배열)의 'length'속성을 읽을 수 없습니다.
JSFiddle : http://jsfiddle.net/wC79k/
내가 제공된 각도 (sensorAngles 배열)와 곡선을 그릴 노력하고 있어요. 이 배열은 블루투스를 통해 업데이트되며 (문자열로 처음 전송 됨), 따라서 수신 된 데이터가 손상되지 않은 경우에만 곡선을 업데이트해야합니다 (각 배열의 전체 요소가 비어 있거나 위조되지 않음).
지금은 setTimeout을 통해 각도 배열을 업데이트하여 블루투스 시리얼 업데이트를 '시뮬레이션'하고 있습니다.
현재 스크립트는 의도 한대로 작동하지만 (손상된 배열/문자열이있는 경우 곡선이 플롯/업데이트되지 않고 손상되지 않은 배열이 수신되면 업데이트가 계속됨) 위의 오류 (인식되지 않는 TypeError)가 발생합니다.
손상된 어레이로 인해 sensorAngles가 정의되지 않은 (줄 길이가 작동하지 않는) 26 번째 줄과 관련이있는 것으로 보입니다.
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
if 문을 추가하려고 시도했지만 커브가 더 이상 업데이트되지 않습니다.
2 일 전 Javascript 및 Phonegap을 시작 했으므로 도움이 될 것입니다.
건배, JD
전체 코드 :
var stage = new Kinetic.Stage({
container: 'myCanvas',
width: window.innerWidth,
height: window.innerHeight
});
var sensorLayer = new Kinetic.Layer();
/* initialise an empty array of all the angles */
var sensorAngles = [0, 0, 0, 0, 0, 0, 0, 0];
//var sensorPos = [];
/* divide each sensor distance segment by height of screen/window for
maximum amount of canvas being used */
var sensorDistance = (stage.getHeight()/((sensorAngles.length) + 2));
function diffPos(angle){ // angles in radians
return {
dx: sensorDistance * Math.sin(angle),
dy: sensorDistance * Math.cos(angle)
}
};
function calcSpline(sensorAngles){
sensorPos = [{x: (stage.getWidth()/2), y: (stage.getHeight() - sensorDistance)}];
for (var i = 0; i < (sensorAngles.length); i++){
sensorPos.push({
x: sensorPos[i].x - diffPos(sensorAngles[i]).dx,
y: sensorPos[i].y - diffPos(sensorAngles[i]).dy
});
}
return sensorPos;
};
calcSpline(sensorAngles);
var sensorPos = calcSpline(sensorAngles);
var spine = new Kinetic.Spline({
points: sensorPos,
stroke: 'red',
strokeWidth: 2,
lineCap: 'round',
tension: 0.3
});
sensorLayer.add(spine);
stage.add(sensorLayer);
function updateSpline(angles){
calcSpline(sanityCheck(angles));
spine.setPoints(sensorPos);
sensorLayer.draw();
};
function sanityCheck(data) {
data = data.split(",");
if (data.filter(function(n){return n}).length === sensorAngles.length) {
sensorAngles = data;
return sensorAngles;
}
}
setTimeout(
function() {
updateSpline("0.1,0.12,0.08,-0.2,0.1,0.85,0.1,-0.2")
},1000
);
setTimeout(
function() {
updateSpline("0.1,0.2,0.1,-0.1,0.1,0.1,0.1,-0.2")
},2000
);
setTimeout(
function() {
updateSpline("0.1,0.12,0.08,-0.2,0.1,0.85,0.1,-0.2")
},3000
);
setTimeout(
function() {
updateSpline("0.4,0.5,,-0.6,0.2,0.96,0.02,-0.01") //corrupt
},4000
);
setTimeout(
function() {
updateSpline("0.1,,0.08,-0.2,0.1,0.85,0.1,-0.2") // corrupt
},5000
);
setTimeout(
function() {
updateSpline("0.6,0.12,0.22,-0.2,0.1,0.85,0.1,-0.2")
},6000
);