刷新网页时保持缩放

时间:2015-03-16 19:34:18

标签: javascript php google-maps gps

大家晚上好。现在我正在开发一个gps本地化Web服务器,我正在从GPS卡到服务器端口嗅探器的坐标,它将坐标写入SQL数据库。 我遇到的问题是我不断刷新网页以获取新数据,但如果用户放大或缩小,或者在刷新时移动中心,则所有这些更改都会丢失。

这是JS片段:

    <script>
// functions below
//Make an array with the coordinates from the db
function initialize() {
    var posicion= [];
    for (var i=0; i< lat.length; i++){
    posicion.push(new google.maps.LatLng(lat[i], long[i])); // Add the coordinates
    }

  var mapOptions = {
    zoom: 16,
     center: posicion[lat.length-1],
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };
 var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); // Render our map within the empty div

  var linea = new google.maps.Polyline({
  path: posicion,
    geodesic: true,
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  linea.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);  
</script>

1 个答案:

答案 0 :(得分:0)

您必须侦听事件“bounds_changed”,然后将结果保存在Cookie上。当你使用reeload时,你将这些值用作缩放和居中的默认值

google.maps.event.addListener(map, 'bounds_changed', (function () {
  var centerTobeSavedOnCookie = map.getCenter();
  var zoomTobeSavedOnCookie = map.getZoom();
  // save values to cookies
  setCookie("gmapDefaultZoom", zoomTobeSavedOnCookie, 1);
  setCookie("gmapDefaultCenter", centerTobeSavedOnCookie , 1);
}()));

function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = "expires="+d.toUTCString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return "";
}