i have to update my google map after 40 seconds or apply time so that my google map updated according to my database latitude and longtitude values

Question

0.00/5 (No votes)

See more:

dear sir/mam,
i have add google map on my project but i have to do it update or set timer for 40 seconds.

i have to update my google map after 40 seconds or apply time so that my google map updated according to my database latitude and longtitude values. my java script cod is .....

XML

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script>
</head>
<body>

    <form id="form1" runat="server">


    <input type="hidden" runat="server" id="data" />
    <input type="hidden" runat="server" id="data2" />
    <input type="hidden" runat="server" id="data3" />

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="Inline">
       <div id="map" style="width: 700px; height: 500px"></div>
       </asp:UpdatePanel>
    <script type="text/javascript">

        var map;
        function initialize(x,y) {

            var latlng = new google.maps.LatLng(x,y);
            var myOptions = {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map"), myOptions);
            var marker = new google.maps.Marker
    (
        {
            position: new google.maps.LatLng(x,y),
            map: map,
            title: 'Click me'
        }
    );
            var infowindow = new google.maps.InfoWindow({
                content: 'User Name:<br/>Time:"'+ document.getElementById('data3').value+'" <br/>LatLng:'+ document.getElementById('data').value +', ' +document.getElementById('data2').value
            });
            google.maps.event.addListener(marker, 'click', function () {
                // Calling the open method of the infoWindow
                infowindow.open(map, marker);
            });
        }


       

        window.onload = initialize(document.getElementById('data').value, document.getElementById('data2').value);



   

  rply soon 

thanks in advance

Posted 22-May-13 4:49am

anshu77

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

vijay__p · Answer 1 · 2013-05-22T18:38:00

Solution 1

You can use setTimeout javascript function to achieve this functionality.
First of all make your marker object global (declare it outside of initialize function.

JavaScript

var map;
var marker;
var interval=40*1000; //40 seconds

        function initialize(x,y) {
setTimeout(function(){
  updateMarkerPosition(x,y);// pass new lat long(position) here.
},interval);

...
}

now create one javascript function to update position of marker on given interval;

JavaScript

function updateMarkerPosition(x,y){
marker.setPosition(new google.maps.LatLng(x,y));

setTimeout(function(){
updateMarkerPosition(x,y);// pass new lat long(position) here.
},interval);
}

Posted 22-May-13 18:38pm

vijay__p

Updated 22-May-13 22:15pm

v3

Comments

anshu77 23-May-13 3:11am

thanks sir

but where i have to apply this function so that my google map automatically updated continuously

anshu77 23-May-13 3:14am

my code is...

<body>

<form id="form1" runat="server">

<input type="hidden" runat="server" id="data" />
<input type="hidden" runat="server" id="data2" />
<input type="hidden" runat="server" id="data3" />

<div id="map" style="width: 700px; height: 500px"></div>

<script type="text/javascript">
var marker;
var map;
function initialize(x, y) {

var latlng = new google.maps.LatLng(x, y);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"), myOptions);
marker = new google.maps.Marker
(
{
position: new google.maps.LatLng(x, y),
map: map,
title: 'Click me'
}
);
var infowindow = new google.maps.InfoWindow({
content: 'User Name:<br/>Time:"' + document.getElementById('data3').value + '" <br/>LatLng:' + document.getElementById('data').value + ', ' + document.getElementById('data2').value
});
google.maps.event.addListener(marker, 'click', function () {
// Calling the open method of the infoWindow
infowindow.open(map, marker);
});

window.onload = initialize(document.getElementById('data').value, document.getElementById('data2').value);

</script>

</form>
</body>
</html>

vijay__p 23-May-13 4:16am

check my updated answer. First call from Initialize function and sub sequent from same function as displayed in answer.

anshu77 27-May-13 3:57am

thank you sir

my google map is refreshing correctly but another problem is that if i change the longtitude and latitude's value in database within 40 seconds then the location of google map is not changed and i have to change location og google map if i chang tha value in table....?

reply
thanks in advance