2011-10-03 7 views
0

는 내가 가로 모드에서 아이폰에 페이지를 볼 때, 나는 0.4로 규모의 명령을 변경하는 데 필요한 것을 발견 jVectorMap http://jvectormap.owl-hollow.net/ 에서 발견 된지도를 사용하여 모바일 사이트에서 작업을 시도하고있다. 그러나 인물 모드에서는 .2와 같이 작을 필요가 있습니다.JQM 방향 SVG 스케일

이 코드를 사용하여 jVectorMap에서 다운로드 한 js 라이브러리의 눈금 값을 조정합니다. 주석 처리 된 코드는

내 질문은, 내가 JS를 통해 화면 방향을 결정할 수 있으며이 규모의 번호를 업데이트 한 방법이 내가 아이폰 화면

applyTransformParams: function(scale, transX, transY) { 
     if (this.mode == 'svg') { 
      this.rootGroup.setAttribute('transform', 'scale(.4) translate(30, '+transY+')'); 
//this.rootGroup.setAttribute('transform', 'scale('+scale+') translate('+transX+', '+transY+')'); 
     } else { 
      this.rootGroup.coordorigin = (this.width-transX)+','+(this.height-transY); 
      this.rootGroup.coordsize = this.width/scale+','+this.height/scale; 
     } 
    } 
에 맞게하기 위해 수정 원래 코드 ? 아니면 모바일에 가장 적합한 명령이 있습니까? 이 같은

답변

1

당신은 브라우저가 onorientationchange 이벤트를 지원하는지 확인 (또는 onresize으로 폴백) 할 수있는 모든 도움을

감사 :

var evt; 
if ((typeof window.orientation !== 'undefined') && ('onorientationchange' in window)) { 
    evt = 'orientationchange'; 
} else { 
    evt = 'resize'; 
} 

당신은 항상 같은 방향을 얻을 수 있습니다 :

var getOrientation = function() { 
    if (evt === 'orientationchange') { 
     return = (window.orientation === 0) ? 'portrait' : 'landscape'; 
    } else { 
     return = (window.innerHeight > window.innerWidth) ? 'portrait' : 'landscape'; 
    } 

}; 

그런 다음 해당 이벤트에 가입하면 & 스케일링을 수행 할 수 있습니다.

var originalOrientation = getOrientation; 
window.addEventListener(evt, function() { 
    var orientation = getOrientation(); 
    if (orientation !== originalOrientation) { 
     originalOrientation = orientation; 
     // do your scaling here... 
    } 
});