Движущиеся объекты на веб карте

CrashX

CrashX

В прошлом XSiteCMS
Регистрация
6 Июн 2008
Сообщения
682
Реакции
114
неважно какая карта
ЯК, Гугл, ОСМ
мне больше интересно
как

допустим есть постоянно обновляемые данные формат не важне
но там есть данные о единице, и скажем 10 ее точек


нужно плавно между точка ее передвигать
для начала хотябы вообще передвигать

интересны советы, возможно примеры
 
Плавности точно не добиться, так как для смены точки необходима перезагрузка карты. {map_reload}
 
я бы так не говорил что не добится
примеры
Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

подгрузив буффер и двигать по векторному направлению ничего не мешает, это уже тонкости...
меня больше инетесует как создать динамический слой как нем отображать и тп
 
на гугл картах есть спец функция для плавного передвижения к точке panTo, двигает карту с анимацией, но проблема только расчитать время за которое должно быть сделано передвижение, если расстояние большое а время маленькое, то очень быстро мелькает.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  #map_canvas { height: 100% }
</style>

<title>Untitled Document</title>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=ru"></script>

<script type="text/javascript">
var map;
var point = 1;

//точки для двигателя
var markers = {
    point1:[55.755786, 37.617633],
    point2:[55.7543712, 37.6104643],
    point3:[55.7531491, 37.6101551],
    point4:[55.7506212, 37.6101143],
    point5:[55.7541852, 37.5274149],
    point6:[55.7473746, 37.609723],
    point7:[55.803607, 37.328598],
    point8:[55.7422534, 37.6064208],
    point9:[55.7397707, 37.6055861],
    point10:[55.704945, 37.5277036],
};

$(document).ready(function(){
       //карта
    var latlng = new google.maps.LatLng(55.755786, 37.617633);
    var myOptions = {
      zoom: 13,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    
    //отмечаем все точки на карте
    var marker = [];
    for(i in markers){
        marker[i] = new google.maps.Marker({
            position: new google.maps.LatLng(markers[i][0], markers[i][1]), 
            map: map
        });
    }
    
    //map.panTo(new google.maps.LatLng(markers.point10[0], markers.point10[1]));
    
    //двигатель карты по точкам
    function mover(){
        map.panTo(new google.maps.LatLng(markers["point"+point][0], markers["point"+point][1]));
        point ++;
        if(point>10)point=1;
    }
    
    //карта не используется
    google.maps.event.addListener(map, 'idle', function(){
        setTimeout(mover, 500);//время в милисекундах
    });

});
</script>

</head>

<body>

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

</body>
</html>
 
Войдите или зарегистрируйтесь для ответа.
Назад
Сверху