JQM Ориентация SVG Шкала - PullRequest
Новая
       34

JQM Ориентация SVG Шкала

0 голосов
/ 03 октября 2011

Я пытаюсь работать на мобильном сайте, используя карты, найденные в jVectorMap http://jvectormap.owl -hollow.net / Я обнаружил, что при просмотре страницы на iphone в альбомном режиме мне нужно было изменитькоманда масштабирования до .4.Однако в портретном режиме он должен быть меньше, например 0,2.

Я использую этот код для настройки значения масштаба, найденного в библиотеке js, загруженной из jVectorMap.Закомментированный код - это исходный код, который я изменил, пытаясь подогнать экран iphone 

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

Мой вопрос: есть ли способ определить ориентацию экрана с помощью js и обновить его?шкала чисел?Или, может быть, есть команда для лучшей подгонки для мобильного телефона?

Спасибо за любую помощь

1 Ответ

1 голос
/ 03 октября 2011

Вы можете проверить, поддерживает ли браузер событие 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...
    }
});
...