【问题标题】:what I did wrong with my accelerometer and canvas 2d? android我的加速度计和画布 2d 做错了什么?安卓
【发布时间】:2013-12-20 12:33:39
【问题描述】:

我正在尝试使用加速度计 API 创建一个 2d 画布。
当我倾斜手机,acceleration.x 和 acceleration.y 发生变化时,API 完整示例有效。
所以我制作了一个画布 2d 圆圈并实现了 acceleration.x 和 acceleration.y 但是当我这样做时,圆圈就消失了。

这是我的html

<canvas id="myCanvas" width="200" height="200" style="border:1px solid #d3d3d3;">
  Your browser does not support the HTML5 canvas tag.</canvas>

这是我的部分脚本

   function movingCircle (acceleration) {
            var c=document.getElementById("myCanvas");
            var ctx=c.getContext("2d");
            var x = acceleration.x;
            var y = acceleration.y;
            ctx.fillStyle = "rgba(255, 255, 0, .5)";
            ctx.beginPath();
            ctx.arc(x,y,20,0,2*Math.PI, true);
            ctx.stroke();
            ctx.closePath();
            ctx.fill();
            c.innerHTML = 'testing';
       }

ctx.arc(x,y,20,0,2*Math.PI, true); 如果我将 x 和 y 更改为 47.5、25,那么我可以清楚地看到我的圆圈位于左上角附近。

谁能帮我看看我在这里做错了什么?

【问题讨论】:

    标签: javascript android html cordova html5-canvas


    【解决方案1】:

    Acceleration 的xy 键不是您可以在其上绘制圆圈的绝对坐标。加速度是速度随时间的差异。因此,您可以将它们作为数量添加到您当前的圈子位置。

    类似:x = x + acceleration.x;

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-02-15
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多