1. База данных PostgreSQL с постоянно обновляемыми координатами подвижных объектов (машин)
Задача:
Отображать координаты получаемые в БД маркерами на онлайн картах.
Решение:
Было решено использовать библиотеку leaflet, в которую при помощи PHP будут подгружаться маркеры из базы.
Чтобы передвижение маркеров можно было отследить без перезагрузки страницы, решено было запускать PHP ajax скриптом.
Возникла проблема с ajax скриптом
Проблема:
При использовании такого способа Скрипт подгружает каждый раз новые маркеры, но вместо того, чтобы заменять старые точки с координатами на новые он добавляет все координаты заново.
Приведу пример кода:
Код: Выделить всё
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; Charset=UTF-8">
//Подключаем библиотеки jquery и leaflet
<script type="text/javascript" src="jquery.js"></script>
<link rel="stylesheet" href="js/leaflet.css" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="js/leaflet.ie.css" />
<![endif]-->
<script src="js/leaflet.js"></script>
</head>
//определяем стиль отображения блока карты
<style>
#map {position: absolute; top: 100px; right: 0px; bottom: 0px; left: 0px }
</style>
<body>
<div id="map"></div>
<script>
//Определяем карту, координаты центра и начальный масштаб
var map = L.map('map').setView([45.041236, 38.98386], 12);
var drvs = L.layerGroup();
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a rel="nofollow" href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
[size=150]//вот тут и кроется проблема, функция updateMarker() будет каждые 1000мс добавлять координаты на карту леафлет, хотя нужно, что бы она при последующем выводе заменяла выведенные ранее данные.
updateMarker();
function updateMarker() {
$.ajax({
dataType: 'script',
url: 'PGSQL3_AJAX.php'
})
setTimeout(updateMarker, 1000);
} [/size]
</script>
</body>
</html>
Вот что именно отдает PGSQL3_AJAX.php:
Код: Выделить всё
L.marker([45.1259878205834,39.0168285369873]).addTo(map); L.marker([45.0817634528028,38.9776039123535]).addTo(map); L.marker([45.0805819240118,38.9750596996026]).addTo(map); L.marker([45.0753769953766,39.0012744303673]).addTo(map); L.marker([45.0723875806419,38.9927041047575]).addTo(map); L.marker([45.0723612309011,38.991199082126]).addTo(map); L.marker([45.071746347362,39.0150545013297]).addTo(map); L.marker([45.0711733333333,39.00089]).addTo(map); L.marker([45.0701867651014,39.0001773834229]).addTo(map); L.marker([45.06738,38.915995]).addTo(map); L.marker([45.0616391191892,38.9544296264648]).addTo(map); L.marker([45.06153,38.98919]).addTo(map); L.marker([45.05947507,38.94810291]).addTo(map); L.marker([45.0576516666667,39.0351016666667]).addTo(map); L.marker([45.0534294,38.99500516]).addTo(map); L.marker([45.0444566666667,38.9779116666667]).addTo(map); L.marker([45.0409583333333,38.9694966666667]).addTo(map); L.marker([45.04038793,39.1139068]).addTo(map); L.marker([45.0391797814518,39.0963603090495]).addTo(map); L.marker([45.0359816666667,39.0211233333333]).addTo(map); L.marker([45.034775,39.08607]).addTo(map); L.marker([45.0337755700343,38.9199648459331]).addTo(map); L.marker([45.03354595,39.0250874]).addTo(map); L.marker([45.0326883333333,39.0501883333333]).addTo(map); L.marker([45.0325820666667,39.05019845]).addTo(map); L.marker([45.0324789338011,39.1333735481155]).addTo(map); L.marker([45.03244814,38.9947175]).addTo(map); L.marker([45.0324098544879,38.9158487319946]).addTo(map); L.marker([45.02969248,38.97342813]).addTo(map); L.marker([45.0279344106093,39.1201467253268]).addTo(map); L.marker([45.02769,38.990575]).addTo(map); L.marker([45.02419252,39.06524453]).addTo(map); L.marker([45.02404108,39.06813827]).addTo(map); L.marker([45.0206865869691,39.022814909977]).addTo(map); L.marker([45.0205516666667,39.049345]).addTo(map); L.marker([45.0203566666667,38.985355]).addTo(map); L.marker([45.0202237384957,39.0494879901535]).addTo(map); L.marker([45.01790209,38.97834139]).addTo(map); L.marker([45.01725,38.99215167]).addTo(map); L.marker([45.0145883333333,39.086435]).addTo(map); L.marker([45.0119583333333,39.066775]).addTo(map); L.marker([45.0050066666667,38.96085]).addTo(map);
1-й каким-то образом сделать так чтоб ajax скрипт заменял ранее добавленные данные на карту
2-й искать решение гдето в выдаваемых php данных.
Огромная просьба подскажите как можно решить или обойти данную проблему. Заранее благодарен.