好的，所以我明白了。
<?php
$json_pos = file_get_contents("C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json");
?>
<!DOCTYPE html>
<html>
<head>
<title>SA:MP live map</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<style type="text/css">
#map-canvas { display: inline-block; height: 800px; width: 800px; }
#map-legend { padding: 10px; background-color: rgba(141, 142, 127, 0.46);}
</style>
</head>
<body>
<div id="map-canvas"></div>
<script src="js/SanMap.min.js"></script>
<script type="text/javascript">
// POISION DATA
var p_pos = <?php echo (empty($json_pos)) ? "" : $json_pos ?>;
// MAP TYPE
var mapType = new SanMapType(0, 1, function (zoom, x, y) {
return x == -1 && y == -1
? "images/tiles/map.outer.png"
: "images/tiles/map." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// SAT TYPE
var satType = new SanMapType(0, 3, function (zoom, x, y) {
return x == -1 && y == -1
? null
: "images/tiles/sat." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// CREATE MAP
var map = SanMap.createMap(document.getElementById('map-canvas'),
{'Map': mapType, 'Satellite': satType}, 2, SanMap.getLatLngFromPos(0,0), false, 'Satellite');
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(document.getElementById('map-legend'));
// IF ONLINE THEN DO FUNCTION CREATE MARKER
if(p_pos !== "")
{
for (var i = 0; i < Object.keys(p_pos).length; i++)
{
if(p_pos[i].online == 1) createMarker(i);
}
}
// MAKRER FUNCTION
function createMarker(id)
{
var p_marker = new google.maps.Marker({
position: SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y),
map: map,
icon: "images/marker.png"
});
}
function updateMarker(id)
{
p_marker.setMap(null);
p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
}
setInterval(function()
{ "updateMarker" }, 1000);
</script>
</body>
</html>
使用它可以工作，但我必须刷新页面才能看到更新的标记位置。我想要做的是让标记每秒更新一次，而不必刷新整个页面/地图
我把它添加到底层认为它会使它工作
function updateMarker(id)
{
p_marker.setMap(null);
p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
}
setInterval(function()
{ "updateMarker" }, 1000);
所以我现在拥有的总页数是
<?php
$json_pos = file_get_contents("C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json");
?>
<!DOCTYPE html>
<html>
<head>
<title>SA:MP live map</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<style type="text/css">
#map-canvas { display: inline-block; height: 800px; width: 800px; }
#map-legend { padding: 10px; background-color: rgba(141, 142, 127, 0.46);}
</style>
</head>
<body>
<div id="map-canvas"></div>
<script src="js/SanMap.min.js"></script>
<script type="text/javascript">
// POISION DATA
var p_pos = <?php echo (empty($json_pos)) ? "" : $json_pos ?>;
// MAP TYPE
var mapType = new SanMapType(0, 1, function (zoom, x, y) {
return x == -1 && y == -1
? "images/tiles/map.outer.png"
: "images/tiles/map." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// SAT TYPE
var satType = new SanMapType(0, 3, function (zoom, x, y) {
return x == -1 && y == -1
? null
: "images/tiles/sat." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// CREATE MAP
var map = SanMap.createMap(document.getElementById('map-canvas'),
{'Map': mapType, 'Satellite': satType}, 2, SanMap.getLatLngFromPos(0,0), false, 'Satellite');
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(document.getElementById('map-legend'));
// IF ONLINE THEN DO FUNCTION CREATE MARKER
if(p_pos !== "")
{
for (var i = 0; i < Object.keys(p_pos).length; i++)
{
if(p_pos[i].online == 1) createMarker(i);
}
}
// MAKRER FUNCTION
function createMarker(id)
{
var p_marker = new google.maps.Marker({
position: SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y),
map: map,
icon: "images/marker.png"
});
}
function updateMarker(id)
{
p_marker.setMap(null);
p_marker.setPosition(SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y))
}
setInterval(function()
{ "updateMarker" }, 1000);
</script>
</body>
</html>
但它仍然是一样的，我必须刷新页面才能看到更新的标记位置。
我在这迷失了。我有正确的想法吗？我把它们放错了吗？请帮帮我
答案 0 :(得分：0)
您确定setInterval() func的实现（语法中有错误）吗？
尝试setInterval(updateMarker, 1000);
https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval
另一个要点是使用AJAX：
$(document).ready(function(){
setInterval(function(){
$.getJSON('C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json', function(data) {
//alert(data); //uncomment this for debug
p_pos = data;
for (var i = 0; i < Object.keys(p_pos).length; i++) updateMarker(i);
});
}, 1000);
});
http://api.jquery.com/jquery.getjson/
<?php
$json_pos = file_get_contents("C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json");
?>
<!DOCTYPE html>
<html>
<head>
<title>SA:MP live map</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<style type="text/css">
#map-canvas { display: inline-block; height: 800px; width: 800px; }
#map-legend { padding: 10px; background-color: rgba(141, 142, 127, 0.46);}
</style>
</head>
<body>
<div id="map-canvas"></div>
<script src="js/SanMap.min.js"></script>
<script type="text/javascript">
// POISION DATA
var p_pos = <?php echo (empty($json_pos)) ? "" : $json_pos ?>;
// MAP TYPE
var mapType = new SanMapType(0, 1, function (zoom, x, y) {
return x == -1 && y == -1
? "images/tiles/map.outer.png"
: "images/tiles/map." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// SAT TYPE
var satType = new SanMapType(0, 3, function (zoom, x, y) {
return x == -1 && y == -1
? null
: "images/tiles/sat." + zoom + "." + x + "." + y + ".png";//Where the tiles are located
});
// CREATE MAP
var map = SanMap.createMap(document.getElementById('map-canvas'),
{'Map': mapType, 'Satellite': satType}, 2, SanMap.getLatLngFromPos(0,0), false, 'Satellite');
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(document.getElementById('map-legend'));
// IF ONLINE THEN DO FUNCTION CREATE MARKER
if(p_pos !== "")
{
for (var i = 0; i < Object.keys(p_pos).length; i++)
{
if(p_pos[i].online == 1) createMarker(i);
}
}
// MAKRER FUNCTION
var p_marker = new Array();// just global array of markers
function createMarker(id){
p_marker[id] = new google.maps.Marker({ // initializing p_marker array of markers
position: SanMap.getLatLngFromPos(p_pos[id].x, p_pos[id].y),
map: map,
icon: "images/marker.png"
});
}
function updateMarker(id, pos){
p_marker[id].setMap(null);// now it's global, so we can access it from here
p_marker[id].setPosition(SanMap.getLatLngFromPos(pos.x, pos.y))
}
$(document).ready(function(){
setInterval(function(){
$.getJSON('C:\Users\KLAUS\Desktop\New\This SAMP\scriptfiles\positions.json', function(data) {
//alert(data); //uncomment this for debug
p_pos = data;
for (var i = 0; i < Object.keys(p_pos).length; i++) updateMarker(i, p_pos[i]);
});
}, 1000);
});
</script>
</body>
</html>