ラズパイ（IOT・７０）

前回使ってみたjQueryのアナログパッドプラグインの
動作を試してみます。
サンプルのコードを試してみます。

  $(function() {
    var analogpad = $('#analogpad').analogpad();

    var width = 300;
    var height = 300;
    var x = width / 2;
    var y = height / 2;
    var scale = 3;

    var draw = function() {
        var canvas = document.getElementById('canvas');
        var context = canvas.getContext('2d');
        context.fillStyle = '#000';
        context.fillRect(0, 0, width, height);
        context.fillStyle = '#fff';
        context.fillRect(x-5, y-5, 10, 10);
    };

    setInterval(function() {
        var input = analogpad.input();
        x = x + input.x * scale;
        y = y - input.y * scale;
        draw();
        $('#x').val(input.x);
        $('#y').val(input.y);
    }, 50);
});

とすると、アナログパッドを動かしたときのX・Y軸の
値が-1～1までの値で取れている事が
確認できました。