Gmap V3,JQM,Cordova Android App在地图缩放上冻结

时间:2015-06-02 13:51:53

标签: android jquery google-maps cordova jquery-mobile

我使用jQuery Mobile和Google Maps V3构建了一个Cordova Android应用程序。

地图可以正常工作一段时间,但是当我尝试缩放或拖动地图4-5次时,应用会冻结。如果我清理缓存/ RAM,它只能再次工作。我使用了自定义标记,标记位置来自SQLite数据库。

<div data-role="page" data-theme="f" id="Gomap" style="width:100%; height:100%;">

    <div role="banner" class="ui-bar-a ui-header" data-role="header" data-position="fixed" data-tap-toggle="false">
        <a data-theme="f" href="branch_locator.html"  data-rel="back" class="ui-btn-left ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-up-a" data-icon="arrow-l">
          <span class="ui-btn-inner ui-btn-corner-all">
            <span class="ui-btn-text">
              Back
            </span>
            <span class="ui-icon ui-icon-arrow-l ui-icon-shadow">
            </span>
          </span>
        </a>
        <h1 aria-level="1" role="heading" tabindex="0" class="ui-title">
          Google Map
        </h1>

    </div>

    <div data-role="content" class="map" id="content">

        <div id="map_canvas" style="height:100%;">

            <div class="img-container"><img src="img/loading8.gif" /> </div>

        </div>

    </div>

    <div data-role="footer" data-position="fixed" data-tap-toggle="false" class="foot">
    </div>
    <!-- /footer -->

    <script type="text/javascript" src="js/map.js"></script>

</div>

map.js

var latt1;

var longg1;

var latt2;

var longg2;

$("#Gomap").on("pageshow", function(e) {

var s = $(this).data("url");

var lat1Part = s.split("&")[0];

var long1Part = s.split("&")[1];

var lat2Part = s.split("&")[2];

var long2Part = s.split("&")[3];

latt1 = lat1Part.split("=")[1];

longg1 = long1Part.split("=")[1];

latt2 = lat2Part.split("=")[1];

longg2 = long2Part.split("=")[1];

loadScript();

});

function initialize() {

$('#map_canvas').empty();

var ur_pos = new google.maps.LatLng(latt1, longg1);

var br_pos = new google.maps.LatLng(latt2, longg2);

$('#map_canvas').gmap();
$('#map_canvas').gmap({
    'center': ur_pos
});
$('#map_canvas').gmap({
    'zoom': 6
});

$('#map_canvas').gmap('addMarker', {
    'position': br_pos,
    'bounds': true,
    'icon':'img/logo.png',
    'animation': google.maps.Animation.DROP
}).click(function() {

    $('#map_canvas').gmap('openInfoWindow', {
    'content': '<B>Some Text Here</B>'
    }, this);

});

$('#map_canvas').gmap('addMarker', {
    'position': ur_pos,
    'bounds': true,
    'animation': google.maps.Animation.DROP
}).click(function() {

    $('#map_canvas').gmap('openInfoWindow', {
    'content': '<B>Your Current Position</B>'
    }, this);

});

$('#map_canvas').gmap('refresh');
}

function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://maps.googleapis.com/maps/api/js?key=GMAP KEY HERE&sensor=false&' +
    'callback=initialize';
document.body.appendChild(script);
}

0 个答案:

没有答案