Web Level Tool for Smartphones Display Device Tilt in Real Time with JavaScript

Web Level Tool for Smartphones Display Device Tilt in Real Time with JavaScript

This is a web tool that allows you to check the level and tilt of your smartphone.
Using JavaScript’s DeviceOrientationEvent, it displays the x‑axis, y‑axis, and z‑axis angles obtained from the phone’s sensors in real time.
It’s a simple and lightweight browser tool recommended for anyone looking for terms like “web level tool”, “smartphone leveling tool”, or “tilt sensor”.

<div id="orientation"></div>

<script>
  window.addEventListener("load",function(){
  window.addEventListener("deviceorientation", function(e){
    let a=e.absolute;//Whether the orientation is in the earth frame or the device's arbitrary frame
    let z=e.alpha;//z-axis 0～360
    let x=e.beta; //x-axis -180～180
    let y=e.gamma;//y-axis -90～90
    document.getElementById("orientation").innerHTML=
      " alpha(z-axis):"+z.toFixed(3)+"<br>"+
      "  beta(x-axis):"+x.toFixed(3)+"<br>"+
      " gamma(y-axis):"+y.toFixed(3);
    });
  });
</script>