如何为您的HTML5游戏校准加速度计

视频: CubeConqueror introduction 2025

默认情况下，HTML5游戏加速度计采取完全水平的中立位置 - 即设备平躺在桌子上。不过，这些都是移动设备，游戏玩家往往希望将中立的位置放在其他地方。

校准倾斜控制的基本技巧是跟踪AX和AY的偏移值。当用户选择重新校准时，偏移值被改变以形成新的中立位置。这是相关的代码：

<！ --1 - >

加速度。 html var game; var球; var accel; var btnCalibrate; var offsetAX = 0; var offsetAY = 0;函数init（）{game = new Scene（）; ball = new Sprite（game，“redBall.png”，50，50）; accel = new Accel（）; btnCalibrate = new GameButton（“calibrate”）; btnCalibrate。 setSize（100，100）; btnCalibrate。 setPosition（100，100）;游戏。函数checkButton（）{ if（btnCalibrate。isClicked（））{ offsetAY = accel。 getAY（）; offsetAX = accel。 getAX（）; } } function update（）{game。明确（）; checkButton（）; newDX = accel。 getAY（） - offsetAY; newDY = accel。 getAX（） - offsetAX; newDX * = -5; newDY * = -5;球。 setDX（newDX）;球。 setDY（newDY）;球。 update（）;} 不知怎的，你需要触发校准。对于这个例子，你添加一个基本的校准按钮。以下是它的工作原理：







 添加offsetAX和offsetAY变量。

这两个变量表示设备的中立位置与标准的平躺式姿态不同。开始在零值的变量。

添加校准按钮。

对于这个例子，用户可以通过点击一个按钮来重新校准。

检查按钮按下。
创建了一个函数来读取任何按钮。
如果按下按钮，则获取新的偏移值。

当按钮处于活动状态时，通过从Accel对象请求它们来查找当前的AX和AY值。
在每一帧上减去ax和ay的偏移量。
在进行任何其他计算之前，从AX减去offsetAX，并从AY中减去offsetAY。这将有效地设置新的中立位置，然而设备在上次点击按钮时被设置。

虽然校准按钮很容易实现，但有时校准是自动完成的。如果您愿意，只需在init（）函数期间确定offsetAX和offsetAY，并且在init（）函数期间设备的姿态变为默认姿态。这不允许用户重新设置校准，但它确实可以防止使用很少使用的按钮使屏幕混乱。