Javascript 在谷歌地图上移动标记

Javascript 在谷歌地图上移动标记,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我正在做一个跟踪系统。 我正在使用codeigniter框架和mongodb连接。 另外,我正在使用GoogleMapJavaScriptAPIv3加载地图。 我能把这个标记载入地图。但我不知道从数据库加载值时如何移动标记。我已经读到我必须使用AJAX来做这件事,但我不知道 我跟着去装马克笔 任何帮助都将不胜感激 谷歌地图的代码不会改变,让我给你一个简单的例子 function initialize() { var map; var bounds = new google.map

我正在做一个跟踪系统。 我正在使用codeigniter框架和mongodb连接。 另外,我正在使用GoogleMapJavaScriptAPIv3加载地图。 我能把这个标记载入地图。但我不知道从数据库加载值时如何移动标记。我已经读到我必须使用AJAX来做这件事,但我不知道

我跟着去装马克笔


任何帮助都将不胜感激

谷歌地图的代码不会改变,让我给你一个简单的例子

function initialize() {
    var map;
    var bounds = new google.maps.LatLngBounds();
    var mapOptions = {
        mapTypeId: 'roadmap'
    };

    // Display a map on the page
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

    // Multiple Markers
    var markers = [
        ['London Eye, London', 51.503454,-0.119562],
        ['Palace of Westminster, London', 51.499633,-0.124755]
    ];

    // Info Window Content
    var infoWindowContent = [
        ['<div class="info_content">' +
        '<h3>London Eye</h3>' +
        '<p>The London Eye is a giant Ferris wheel situated on the banks of the River Thames. The entire structure is 135 metres (443 ft) tall and the wheel has a diameter of 120 metres (394 ft).</p>' +        '</div>'],
        ['<div class="info_content">' +
        '<h3>Palace of Westminster</h3>' +
        '<p>The Palace of Westminster is the meeting place of the House of Commons and the House of Lords, the two houses of the Parliament of the United Kingdom. Commonly known as the Houses of Parliament after its tenants.</p>' +
        '</div>']
    ];

    // Display multiple markers on a map
    var infoWindow = new google.maps.InfoWindow(), marker, i;

    // Loop through our array of markers & place each one on the map  
    for( i = 0; i < markers.length; i++ ) {
        var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
        bounds.extend(position);
        marker = new google.maps.Marker({
            position: position,
            map: map,
            title: markers[i][0]
        });

        // Allow each marker to have an info window    
        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infoWindow.setContent(infoWindowContent[i][0]);
                infoWindow.open(map, marker);
            }
        })(marker, i));

        // Automatically center the map fitting all markers on the screen
        map.fitBounds(bounds);
    }

    // Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
    var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
        this.setZoom(14);
        google.maps.event.removeListener(boundsListener);
    });

}
您可以看到,我在3秒(3000毫秒)后调用JS函数,在这一过程中,我调用PHP函数从数据库中获取最新的值


你可以运用这个技巧来完成它。

这是你想要的代码

$query = "select * from  table";
$result= mysql_query($query);
$lat[] = array();
$lng[]=array();
$x=0;
while($rows=mysql_fetch_array($result))
{
    $lat[$x]=$rows['X'];
    $lng[$x]=$rows['Y'];
    $x++;

}//here is your connection in db

var markersdata=[];
function dd()
{

    latLocation =<?php echo json_encode($lat); ?>;
    lngLocation =<?php echo json_encode($lng); ?>;

            for (var i = 0; i < latLocation.length; i++) {
        //

                    makeMarker(latLoc[i],lngLoc[i]);


            }

}
funtion makeMarker(lati, longi)
{

   var markerOptions = {map: map, position: new google.maps.LatLng(lati, longi)};`
   var marker = new google.maps.Marker(markerOptions);`

}
//this code is working. leave comment if you have any question
$query=“从表中选择*”;
$result=mysql\u query($query);
$lat[]=array();
$lng[]=array();
$x=0;
while($rows=mysql\u fetch\u array($result))
{
$lat[$x]=$rows['x'];
$lng[$x]=$rows['Y'];
$x++;
}//这是您在db中的连接
var markersdata=[];
函数dd()
{
latLocation=;
语言=;
对于(变量i=0;i
你面临什么问题?@GPRathour
我能够在地图上加载标记。但是当从数据库加载值时,我不知道如何移动标记
move marker means?你是想说,如何根据数据库中的值绘制标记?我想做这样的事情。但我想从数据库中加载这些值。(纬度和经度)向下倾斜。。这个问题太宽泛了。。它涵盖了各种各样的架构问题。。但是移动标记包含在“设置位置”的API文档中。只需输入创建map的代码,然后调用函数dd。希望这会有帮助,非常感谢。我有个问题。“db连接”的代码段放在哪里?它是否在视图文件的主体标记内?因为我的理解是,必须一次又一次地调用它来获取最新的坐标。把它放在体内,它会自动查询数据库
setInterval(function(){


    $.get( "YOUR_PHP_PAGE", function( data ) {
        //Do what you want with data
        alert(data);
    });


}, 3000);
$query = "select * from  table";
$result= mysql_query($query);
$lat[] = array();
$lng[]=array();
$x=0;
while($rows=mysql_fetch_array($result))
{
    $lat[$x]=$rows['X'];
    $lng[$x]=$rows['Y'];
    $x++;

}//here is your connection in db

var markersdata=[];
function dd()
{

    latLocation =<?php echo json_encode($lat); ?>;
    lngLocation =<?php echo json_encode($lng); ?>;

            for (var i = 0; i < latLocation.length; i++) {
        //

                    makeMarker(latLoc[i],lngLoc[i]);


            }

}
funtion makeMarker(lati, longi)
{

   var markerOptions = {map: map, position: new google.maps.LatLng(lati, longi)};`
   var marker = new google.maps.Marker(markerOptions);`

}
//this code is working. leave comment if you have any question