2016-09-22 13 views
1

当应用程序调用手机的键盘(编辑文字时),地图面板变换,如下图所示: enter image description here 可能是什么原因,我添加的地图是这样的:科尔多瓦:传单地图图块禁用转换映射窗格

map = L.map('main').setView([9.123011560267038, 125.53513369515711], 15); 
    L.tileLayer('./tile/cbr_new_design_tms2/{z}/{x}/{y}.png', { 
     minZoom: 14, 
     maxZoom: 16, 
     tms: true 
    }).addTo(map); 

HTML:

<div class="panel" id="main" style="padding:0;overflow:hidden" data-title="Main"> 
       <header> 
        <h1>Main</h1> 
        <a href="#modal1" class="button big icon question" style="float:right;padding-top:0;outline:0" data-transition="up-reveal"></a> 
        <a href="#modal" class="button big icon settings" style="padding-top:0;outline:0" data-transition="up-reveal"></a> 
       </header> 

      </div> 

更新:我注意到,当键盘调用,小叶增加class="leaflet-map-pane" style="transform: translate3d(XXpx, XXpx, XXpx);"。它以某种方式转换地图窗格。那么,如何防止传单转化呢?

+1

见https://stackoverflow.com/questions/38509121/leaflet-map-on-android-disrupted-by-appearance-of-keyboard – ghybs

+0

我使用科尔多瓦。 –

+0

您也可以使用Cordova自定义您的Android清单。看例如:https://stackoverflow.com/questions/12833145/how-to-properly-configure-phonegap-for-android-so-it-does-not-zoom-on-text-input/27145959#27145959和刚刚得到了与之相反的问题的人:https://stackoverflow.com/questions/39627268/android-webview-keyboard-covering-up-input – ghybs

回答

0

正如@ghybs指出的那样,Cordova配置选项很有可能解决这个问题。

否则,如果您可以在用户隐藏键盘时运行ome javascript代码,请在地图实例上调用invalidateSize()方法。

+0

我已经尝试了你和@ghybs的建议,他们都没有工作。 –

0

通过注释leaflet-src.js解决了这个:

_onResize: function() { 
     L.Util.cancelAnimFrame(this._resizeRequest); 
     this._resizeRequest = L.Util.requestAnimFrame(
       function() { this.invalidateSize({debounceMoveend: true}); }, this, false, this._container); 
    },