iphone - 如何在网络应用程序中控制 iPhone 的屏幕方向

Question

我有一个非常基本的网页，它使用 flot 创建一个基于 canvas 的图表(类似于 SO 用于声誉图表的内容)。

如果是 PC 显示器，它应该只是正常输出，宽度(x 轴)是高度的 1.6 倍。

但对于 iPhone，我希望页面默认为横向，而不是让它以“纵向”方向溢出，鼓励(或强制)用户像 PC 用户一样转动手机来查看图表.

所以我的问题是:

1) 有没有办法(使用 CSS、JS 或简单的 HTML head 标签)让 Canvas 在检测到纵向时旋转 90 度？

2) 有没有一种方法可以旋转元素/对象，而不管谁在查看它？

3) 有没有办法避免 iPhone 在设备旋转时旋转内容的默认行为？显然，我希望用户在看到它出现在侧面时旋转设备，但我不希望图形翻转并且在他们转动手机时仍然在侧面，戏弄他们继续翻转手机并且永远不会得到图表保持静止。

谢谢!

Answer 1

像这样。

window.onorientationchange = function() {

  var orientation = window.orientation;
  switch(orientation) {
    case 0:

    document.body.setAttribute("class","portrait");

    break; 

    case 90:

    document.body.setAttribute("class","landscapeLeft");

    document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the left (Home button to the right).";
    break;

    case -90: 

    document.body.setAttribute("class","landscapeRight");

    document.getElementById("currentOrientation").innerHTML="Now in landscape orientation and turned to the right (Home button to the left).";
    break;
  }
}