0

キャンバス要素の配列があり、それぞれが定義された関数を使用してこれらの要素と対話します。

問題がありますが、そうします。

現在クリックされているキャンバス要素を socket.io を介して送信しようとすると、カーソルがあった場所に関する情報を格納する必要がある previousInfo 変数の認識に問題があるようです。

例：

canvas[i].onTouchStart = onTouchStartEventFunction;

canvas[i].onTouchMove = onTouchMoveEventFunction;

canvas[i].onTouchEnd = onTouchEndEventFunction;

これにより、キャンバス配列が作成され、各インスタンスが配列に格納されます。

機能:

var onTouchStartEventFunction = function(info, index, count, event) {
draw(info.layerX, info.layerY, event.type, info.layerX, info.layerY, this);
    socket.emit('touchevent', {
        x: info.layerX,
        y: info.layerY,
        e: event.type,
        px: info.layerX,
        py: info.layerY,
        idx: this
});
}

var onTouchMoveEventFunction = function(info, index, count, previousInfo, event) {
if(previousInfo === null) 
{} 
else {
    document.getElementById("timer").innerHTML = "X: " + info.layerX + " Y: " + info.layerY + " pX:" + previousInfo.layerX + " pY:" + previousInfo.layerY;
    draw(info.layerX, info.layerY, event.type, previousInfo.layerX, previousInfo.layerY, this);
    socket.emit('touchevent', {
        x: info.layerX,
        y: info.layerY,
        e: event.type,
        px: previousInfo.layerX,
        py: previousInfo.layerY,
        idx: this
    });
}
}

var onTouchEndEventFunction = function(info, index, count, event) {
draw(info.layerX, info.layerY, event.type, info.layerX, info.layerY, this);
socket.emit('touchevent', {
    x: info.layerX, 
    y: info.layerY,
    e: event.type,
    px: info.layerX,
    py: info.layerY,
    idx: this
});
}

'idx:this' をソケット経由で渡さなければ、すべて正常に機能し、previousInfo は期待どおりに機能します。ただし、「idx:this」の使用を開始するたびに、pX と pY (previousInfo の X 座標と Y 座標) は常に同じで、変更はありません。

最悪なのは、これがすべてのインスタンスで発生し、どこをクリックしても、pX と pY のポイントが常に同じままであることです。

それで、これを考えると、誰かが私が間違っていることを指摘できますか?

よろしくお願いします

4

1 に答える 1

0

問題の説明には何かが欠けているようですが、自己呼び出し関数を作成してみます。

 var onTouchEndEventFunction = function(info, index, count, event) {
     draw(info.layerX, info.layerY, event.type, info.layerX, info.layerY, this);
     (function (canvas) {
        socket.emit('touchevent', {
            x: info.layerX, 
            y: info.layerY,
            e: event.type,
            px: info.layerX,
            py: info.layerY,
            idx: canvas
    });)(this);
  }
于 2012-10-30T05:28:42.610 に答える