웹 응용 프로그램에서 iPhone의 화면 방향을 제어하는 ​​방법

Question

flote를 사용하여 canvas 기반 그래프 (SO가 평판 그래프에 사용하는 것과 비슷한)를 만드는 매우 기본적인 웹 페이지가 있습니다.

PC 디스플레이의 경우 너비 (x 축)가 높이의 1.6 배인 정상적으로 출력되어야합니다.

그러나 iPhones의 경우 "세로"방향으로 오버플로가 아닌 페이지가 가로 방향으로 기본 설정되어 사용자가 PC 사용자로 차트를보기 위해 휴대 전화를 켜도록 (또는 강제로) 설정하는 것이 좋습니다. 할 것이다.

그래서 내 질문은 :

1) 세로 방향의 탐지에 90도 회전 캔버스를 가지고 CSS, JS, 또는 단순히 HTML 헤드 태그)를 사용하는 방법이 (가 있습니까?

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; 
    } 
} 

Answer 2

1/2) -web-transform을 사용해 보셨습니까? 참조이 당신이 자동 회전 다른 옵션은 다음과 같은 코드를 사용하여 CSS를 대상으로하는 것입니다

Answer 3

억제 할 수 없다고 생각 Apple web page

3) :

/* Portrait */ 
@media screen and (max-width: 320px){ 
    /* Place your style definitions here */ 
} 

/* Landscape */ 
@media screen and (min-width: 321px){ 
    /* Place your style definitions here */ 
}