使用陀螺仪使用Javascript或jQuery循环浏览所有RGB颜色

我需要有一个元素（文本或背景）循环通过所有可用的RGB颜色使用陀螺仪

我已经找到了一些关于使用设备定向生成值的文章

我将如何使用这些数据循环RGB颜色值，并将其显示在元素上，以便在手机旋转时改变颜色

非常感谢任何帮助或指导。

---

据我所知，由于无法在我当前的环境中测试陀螺仪事件，您需要做的是将

alpha

、

beta

和

gamma

映射到

R

、

G

和

B

。为此，应将这些值的范围映射到RGB范围[0255]。使用一个通用函数和链接中提到的范围，我构建了一个快速演示，您可以在下面看到。我还提供了测试样本，看看它是否有效，看起来是否合理：

//将数字范围映射到另一个数字范围
var mapRange=函数（从，到，s）{
返回到[0]+（s-从[0]）*（到[1]-到[0]）/（从[1]-从[0]）；
};
//事件侦听器和逻辑
window.addEventListener（'deviceorientation'，函数（eventData）{
//指南针方向-将返回一个介于0和360之间的值
var R=Math.round（mapRange（[0,360]，[0,255]，eventData.alpha））；
//侧向值-将返回介于-180和180之间的值
var G=Math.round（mapRange（[-180180]，[0255]，eventData.beta））；
//前后值-将返回一个介于-90和90之间的值
VARB=Math.round（mapRange（[-90,90]，[0255]，eventData.gamma））；
log（R，G，B）；//示例输出，随意处理
});
//测试1
var eventDataSample1={
阿尔法：125，
贝塔-65，
伽马-2
}
var R=Math.round（映射范围（[0,360]，[0,255]，eventDataSample1.alpha））；
var G=Math.round（mapRange（[-180180]，[0255]，eventDataSample1.beta））；
VarB=数学圆（mapRange（[-90,90]，[0255]，eventDataSample1.gamma））；
控制台日志（R、G、B）；
//测试2
var eventDataSample2={
阿尔法：12，
贝塔：66，
伽马：17
}
var R=Math.round（映射范围（[0,360]，[0,255]，eventDataSample2.alpha））；
var G=Math.round（mapRange（[-180180]，[0255]，eventDataSample2.beta））；
VarB=数学圆（mapRange（[-90,90]，[0255]，eventDataSample2.gamma））；
控制台日志（R、G、B）

难道你不能将陀螺仪的

X

和

Y

映射到调色板上的一个像素（即@Us和Them4尝试加载到该值以抵消变化，这样当该值较低时，它会被更改为较高的值，但当该值较高且超过范围内的上限时，它会返回到范围内的较低值。太棒了，谢谢。设法将H值映射到正常工作的伽马值。不过，唯一的问题是，当手机是平板的时候，它的启动颜色是错误的。例如，当手机处于0时，如何开始使用特定颜色？好的，非常感谢，我会尝试一下