更新地图标记而不刷新页面-传单

Question

I have a situation here. 我这里有个情况。 I am trying to show current position of a subject on online map using leaflet Javascript library. 我正在尝试使用传单Javascript库在在线地图上显示主题的当前位置。 There are two pages of my site. 我的网站有两页。 Page-1 have the map display and Page-2 inputs the current position of the subject and sets the map accordingly. 第1页显示地图，第2页输入对象的当前位置并相应地设置地图。 I am using a blue marker to show the subject location on the map. 我正在使用蓝色标记在地图上显示主题位置。 The marker is appearing correctly if I load the Page-1, but if I update the position on Page-2 then subject's position is not get updated on the map on Page-1. 如果我加载Page-1，标记会正确显示，但是如果我更新Page-2上的位置，则在页面1上的地图上不会更新主题的位置。

Here is my Page-1 code: 这是我的Page-1代码：

<!DOCTYPE html>
<html>
<head>
<title></title>
<h1></h1>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" />
<link rel="stylesheet" href="CSS/mystyle.css" />
<!--[if lte IE 8]>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.ie.css" />
<![endif]-->
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
<script src="SCRIPT/jquery-1.9.1.js"></script>
<script src="SCRIPT/myscript.js"></script>
</head>

<body onload="LoadMap()">
<h2>Current location:</h2>
<table border="1" id="currentloc_table">
    <tr>
        <th>Name</th>
        <th>IMEI</th>
        <th>Latitude</th>
        <th>Longitude</th>
    </tr>
    <tr>
        <td>Azeem HTC Device</td>
        <td>357710043411902</td>
        <td></td>
        <td></td>
    </tr>
</table>
<br/><br/>
<div id="map"></div>
</body>
</html>

Here is the code of myscript.js : 这是myscript.js的代码：

            var map;
            var marker;

            function LoadMap()
            {

                $.ajax({
                        url: "../Database/getcurrentlocation.php?deviceId=357710043411902",
                        success: function(data){
                            if(data!=null)
                            {
                                var dataArray = data.split(/~/);
                                SetMap(dataArray[0],dataArray[1]);
                            }
                         }
                      });


                setTimeout(function(){LoadMap();},10000);
            }

            function SetMap(lati,longi)
            {
                var loc_table = document.getElementById('currentloc_table');
                loc_table.rows[1].cells[2].innerHTML = lati;
                loc_table.rows[1].cells[3].innerHTML = longi;
                map = L.map('map').setView([lati, longi], 12);
                L.tileLayer('http://{s}.tile.cloudmade.com/XXXXXXXXXXXXXXXXXXXXXXXXXXXX/997/256/{z}/{x}/{y}.png', {
                attribution: '',
                maxZoom: 18
                }).addTo(map);
                marker = L.marker([lati, longi]).addTo(map);
            }

The map gets updated when I reload the page. 重新加载页面时，地图会更新。 But can i update the map with new position without performing page-1 refresh? 但是我可以在不执行第1页刷新的情况下以新位置更新地图吗？

Thanks 谢谢

Answer 1

just put 刚放

setTimeout(function(){LoadMap();},10000);

outside the LoadMap function 在LoadMap函数之外

更新地图标记而不刷新页面-传单

问题描述

1 个解决方案

解决方案1
1 2013-02-09 19:27:05

更新地图标记而不刷新页面-传单

问题描述

1 个解决方案

解决方案1 1 2013-02-09 19:27:05

解决方案1
1 2013-02-09 19:27:05