locked
The color of infoboxes on Google Maps is not changing RRS feed

  • Question

  • User2074777333 posted

    Hi,

    I want to change the color of infobox depending on one of the values which are part of the infobox's content. I tried like this:

      if(mark[1]<10) 
                            {
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:green; padding: 5px;";
                                
                            }
                             else if(40<mark[1]<50)
                            {
                               boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:  #acb6e5; padding: 5px;";                            
    
                            }
                            else if(50<mark[1]<60)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:#c4ace5 ; padding: 5px;";
                               
                            }
                            else if(60<mark[1]<70)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #ace5db; padding: 5px;";
                                                         
                            }
                            else if(70<mark[1]<80)
                            { 
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #b6e5ac; padding: 5px;";                           
                            }
     else 
                            {
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:#e5acb6; color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; 
                          
                            }
                            boxText.innerHTML = '<div id="content">' + '<b class="marker-heading">' + markerData[i].address + '</b>' + "<br>" + '<b>' + "-------------" + "<br>" + markerData[i].state + "<br>" + markerData[i].cycles + "<br>" + markerData[i].Los + '</b>'; 
    
     infoboxOptions = {
                                content: boxText,
                                disableAutoPan: false,
                                maxWidth: 0,
                                pixelOffset: new google.maps.Size(-60, 0), //-140,0
                                zIndex: null,
                                boxStyle: {//17.09
                                    background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
                                    opacity: 0.75,
                                    width: "70px" //it was 280px
                                },
                                closeBoxMargin: "10px 4px 2px 2px", //12px 4px 2px 2px
                                closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
                                infoBoxClearance: new google.maps.Size(1, 1),
                                isHidden: false,
                                pane: "floatPane",
                                enableEventPropagation: false
                            };
    
                            newMarkers.push(marker);
                                                  
                            newMarkers[i].infobox = new InfoBox(infoboxOptions);
                            
                            newMarkers[i].infobox.open(map, marker);
    
                            google.maps.event.addListener(marker, 'click', (function (marker, i) {
                                return function () {
                                                                    newMarkers[i].infobox.open(map, this);
                                    map.panTo(markerData[i].latLng);
                                }
                            })(marker, i));
    

    but then all the infoboxes have the same colors as the color for the first marker that appears, no metter what the value in the content is. Can anybody help me how to solve this?
    Thanks

    PS I tried to add this as well

                 google.maps.event.addDomListener(document.getElementById('infobox'),  'change', function() {      newMarkers[i].infobox.style=this.cssText  });

    but it doesn't work

    Wednesday, September 17, 2014 10:31 AM

All replies

  • User-138061656 posted

    The problem is in Css code .Background usage is not such that.

    boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:green; padding: 5px;";


    This line must be like this . 

    boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background-color:green; padding: 5px;";

    and in others

    Thursday, September 18, 2014 4:08 AM
  • User61956409 posted

    Hi nat,

    Thanks for your post.

    nat06

    The color of infoboxes on Google Maps is not changing

    You could refer to onurmenal’s reply. Besides, your issue is related to Google Maps, it is out of our support scope. you could post your problem in Google Maps Help Forum for professional help.

    Thanks for your understanding.

    Best Regards,

    Fei Han

    Thursday, September 18, 2014 6:13 AM
  • User2074777333 posted

    Thanks onurmenal, but then how it works for the first appearing infobox? The problem is that all of the infoboxes get the same color, instead of the color that are given. I have read in one forum that it is not possible this to be done in a loop since always all the boxes will get the same color, but I don't know how to achieve that.

    However I will try this, and come back to you with an answer

    Thursday, September 18, 2014 10:02 PM
  • User2074777333 posted

    I tried onurmenal but it doesn't matter whether it is written like you did or like I did, I get the same result. SO, I am afraid that is not the solution to my problem. Thanks for the try anyway

    Friday, September 19, 2014 10:17 AM
  • User2009744128 posted

    Hi Natasha,

    Check out the following code, I created a sample for you, it is working fine, the infobox background color is changing.

    Please try the code and revert if this is not what you want.

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>infoBox</title>
         <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
         <script type="text/javascript"
        src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infobox.js"> </script>
        <script type="text/javascript">
            function initMap()
            {
               var map = new google.maps.Map(document.getElementById('map_canvas'), {
                    zoom: 7,
                    center: new google.maps.LatLng(17.3456,78.4569),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                });
                var marker = new google.maps.Marker({
                    map: map,
                    draggable: true,
                     google.maps.LatLng(17.47216, 79.76307),
                    visible: true
                });
    
                var boxText = document.createElement("div");
                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #00FFFF; padding: 5px;";
                boxText.innerHTML = "some street, telangana<br>India<br/>Asia<br/>World";
    
                var myOptions = {
                    content: boxText
                    , disableAutoPan: false
                    , maxWidth: 0
                    , pixelOffset: new google.maps.Size(-140, 0)
                    , zIndex: null
                    , boxStyle: {
                        background: "url('bullet.png') no-repeat"
                      , opacity: 0.75
                      , width: "280px"
                    }
                    , closeBoxMargin: "10px 2px 2px 2px"
                    , closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
                    , infoBoxClearance: new google.maps.Size(1, 1)
                    , isHidden: false
                    , pane: "floatPane"
                    , enableEventPropagation: false
                };
    
                var ib = new InfoBox(myOptions);
                ib.open(map, marker);
                google.maps.event.addListener(marker, 'click', function () {
                    boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;";
                    ib.open(map, marker);
                });
            }
    
        </script>
    </head>
    <body onload="initMap()">
        <form id="form1" runat="server">
        <div id="map_canvas" style="height:800px;width:1200px;">
        
        </div>
        </form>
    </body>
    </html>
    

    Here is a working sample:

    Hope this helps.

    Monday, September 22, 2014 1:17 AM
  • User2074777333 posted

    Hi Shivi,

    Thanks a lot. I tried even like this (I tailored your code to mine)

      else if(50<mark[1]<60)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:#c4ace5 ; padding: 5px;";
                                //  boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:grey; color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                                //alert("mark[1]"+mark[1]);    #acb6e5
                                google.maps.event.addListener(marker, 'click', (function (marker, i) {
                                    return function () {
                                        //for (h = 0; h < newMarkers.length; h++) {
                                        //    newMarkers[h].infobox.close();
                                        //}                               
                                        boxText.style.cssText = this.content;
                                        newMarkers[i].infobox.open(map, this);
                                        map.panTo(markerData[i].latLng);
                                    }
                                })(marker, i));
                            }
                            else if(60<mark[1]<70)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #ace5db; padding: 5px;";
                                //  boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:yellow; color:#e5acb6; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                                google.maps.event.addListener(marker, 'click', (function (marker, i) {
                                    return function () {
                                        //for (h = 0; h < newMarkers.length; h++) {
                                        //    newMarkers[h].infobox.close();
                                        //}                               
                                        boxText.style.cssText = this.content;
                                        newMarkers[i].infobox.open(map, this);
                                        map.panTo(markerData[i].latLng);
                                    }
                                })(marker, i));
                            }

    but again I get the same color for both markers (actually I did for all markers and the color is the same, not changing)

    Tuesday, September 23, 2014 2:31 PM
  • User2009744128 posted

    share the entire code Natasha!

    Wednesday, September 24, 2014 6:14 AM
  • User2074777333 posted

    Hi Shivi,

    Here is the function which is embedded in function initialize()

    function initMarkersE(map, markerData) {
                        var newMarkers = [],
                            marker;
    
                        for (var i = 0; i < markerData.length; i++) {
                            bounds.extend(markerData[i].latLng);//27.05
                            map.fitBounds(bounds);//27.05
    
                            marker = new google.maps.Marker({
                                map: map,
                                draggable: true,
                                [i].latLng,
                                visible: false//,
                                //  icon: 'Libraries\Pictures\pin_green.jpeg'
                            }),
    
                          
                            boxText = document.createElement("div"),
    
                            if(mark[1]<10+ "%") 
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:blue; padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:blue; color:#e5acb6; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
    
                            }
                            else if(10+ "%"<mark[1]<20+ "%")
                            {
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: grey; padding: 5px;";
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:blue; color:#e5acb6; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
    
                            }
                            else if(20+ "%"<mark[1]<30+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: green; padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FFC0CB); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
    
                            }
                            else if(30+ "%"<mark[1]<40+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (8A2BE2); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(8A2BE2); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
    
                            }
                            else if(40+ "%"<mark[1]<50+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FF7F50); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FF7F50); color:#e5acb6; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
    
                            }
                            else if(50<mark[1]<60)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background:#c4ace5 ; padding: 5px;";
                               //  boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:grey; color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                                //alert("mark[1]"+mark[1]);    #acb6e5
                            }
                            else if(60<mark[1]<70)
                            {
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #ace5db; padding: 5px;";
                              //  boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:yellow; color:#e5acb6; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                                
                            }
                            else if(70<mark[1]<80)
                            { 
                                alert("mark[1]"+mark[1]);
                                boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #b6e5ac; padding: 5px;";
                               // boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:blue; color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                               
                            }
                            else if(80<mark[1]<90)
                            {alert("mark[1]"+mark[1]);
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FFC0CB); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FFC0CB); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(90+ "%"<mark[1]<100+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (C0C0C0); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(C0C0C0); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(110+ "%"<mark[1]<120+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FF7F50); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FF7F50); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(120+ "%"<mark[1]<130+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FFA500); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FFA500); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(130+ "%"<mark[1]<140+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (DDA0DD); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(DDA0DD); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(140+ "%"<mark[1]<150+ "%")
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (B0E0E6); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(B0E0E6); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
            
                            }
                            else if(150+ "%"<mark[1]<160+ "%")
                            {
                                //boxText.style.cssText= "border: 1px solid black; margin-top: 8px; background: (FFE4E1); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:(FFE4E1); color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                          
                            }
                            else 
                            {
                                //boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: (E6E6FA); padding: 5px;";
                                boxText.style.cssText = "border: 1px solid black; margin-top: 4px; text-wrap:unrestricted; background:#e5acb6; color:#000000; font-family:Arial; font-size:10px; padding: 5px; border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px;"; //margin-top: 8px was like this
                          
                            }
                            boxText.innerHTML = '<div id="content">' + '<b class="marker-heading">' + markerData[i].address + '</b>' + "<br>" + '<b>' + "-------------" + "<br>" + markerData[i].state + "<br>" + markerData[i].cycles + "<br>" + markerData[i].Los + '</b>'; //original
                           
                            infoboxOptions = {
                                content: boxText,
                                disableAutoPan: false,
                                maxWidth: 0,
                                pixelOffset: new google.maps.Size(-60, 0), //-140,0
                                zIndex: null,
                                boxStyle: {//17.09
                                 //   background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat",
                                    opacity: 0.75,
                                    width: "70px" //it was 280px
                                },
                                closeBoxMargin: "10px 4px 2px 2px", //12px 4px 2px 2px
                                closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
                                infoBoxClearance: new google.maps.Size(1, 1),
                                isHidden: false,
                                pane: "floatPane",
                                enableEventPropagation: false
                            };
    
                            newMarkers.push(marker);
                          
                            newMarkers[i].infobox = new InfoBox(infoboxOptions);
                            //Open box when page is loaded
                            newMarkers[i].infobox.open(map, marker);
    
    
                            google.maps.event.addListener(marker, 'click', (function (marker, i) {
                                return function () {
                                    //for (h = 0; h < newMarkers.length; h++) {
                                    //    newMarkers[h].infobox.close();
                                    //}
                                    boxText.style.cssText = this.content;
                                    newMarkers[i].infobox.open(map, this);
                                    map.panTo(markerData[i].latLng);
                                }
                            })(marker, i));
                                                  
     
                          
                             var boxTextTotal = document.createElement("div"); 
                             boxTextTotal.id = i; //and the for the doughnut chart
    
                             boxTextTotal.style.cssText="";
                           // alert("markerData[i].address1"+markerData[i].address1);
    
                             if(mark[1]<10) 
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background:blue; padding: 5px;";                         
                             }
                             else if(10<mark[1]<20)
                                {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: #ace5db; padding: 5px;";
                                 alert(markerData[i].address1);
                             }
                             else if(20<mark[1]<30)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: green; padding: 5px;";
                                 alert(markerData[i].address1);
                             }
                             else if(30<mark[1]<40)
                                 {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (8A2BE2); padding: 5px;";
                         
                             }
                             else if(40<mark[1]<50)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FF7F50); padding: 5px;";
                         
                             }
                             else if(50+"%"<mark[1]<60+"%")
                             {
                                 alert(markerData[i].state);
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: #ace5db; padding: 5px;";
                         
                             }
                             else if(60<mark[1]<70)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;";
                                 alert("markerData[i].address1"+markerData[i].address1);
                             }
                             else if(70<mark[1]<80)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: blue; padding: 5px;";
                         
                             }
                             else if(80<mark[1]<90)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FFC0CB); padding: 5px;";
                                 alert(markerData[i].address1);
                             }
                             else if(90<mark[1]<100)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (C0C0C0); padding: 5px;";
                                 alert(markerData[i].address1);
                             }
                             else if(110<mark[1]<120)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FF7F50); padding: 5px;";
                                 alert(markerData[i].address1);
                             }
                             else if(120<mark[1]<130)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FFA500); padding: 5px;";
                         
                             }
                             else if(130<mark[1]<140)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (DDA0DD); padding: 5px;";
                         
                             }
                             else if(140<mark[1]<150)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (B0E0E6); padding: 5px;";
                         
                             }
                             else if(150<mark[1]<160)
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (FFE4E1); padding: 5px;";
                         
                             }
                             else 
                             {
                                 boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: (E6E6FA); padding: 5px;";
                         
                             }
                           // boxTextTotal.style.cssText = "border: 1px solid black; margin-top: 8px; background: grey; padding: 5px;";
                            boxTextTotal.innerHTML = '<div id="content">' + '<b class="marker-heading">' + markerData[i].address1 + '</b>' + "<br>" + "-------------" + "<br>" + '<b>' + markerData[i].state + "<br>" + markerData[i].cycles1 + "<br>" + markerData[i].Los1 + '</b>'; //original
                            // boxTextTotal.innerHTML = "The expanded text";
                            var myOptionsNew = {
                                content: boxTextTotal
                                , disableAutoPan: false
                                , maxWidth: 0
                                , pixelOffset: new google.maps.Size(-140, 80) //try with new google.maps.Size(-140, 100) 
                                , zIndex: null
                                , boxStyle: {
                                    background: "url('Images/orderedList4.png') no-repeat"
                                    , opacity: 0.85
                                    , width: "180px"
                                }
                                , closeBoxMargin: "10px 2px 2px 2px"
                                , closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif"
                                , infoBoxClearance: new google.maps.Size(1, 1)
                                , isHidden: false
                                , pane: "floatPane"
                                , enableEventPropagation: false
                            };
    
                            google.maps.event.addDomListener(newMarkers[i].infobox.content_, 'click', (function (marker, i) {
                                return function () {
                                    newMarkers[i].infobox.close();
                                    var ib = new InfoBox(myOptionsNew);
                                    ib.open(map, marker);
                                    //infowindowNew.open(map, this);                                
                                }
                            })(marker, i));
    
                           
                                              }
    
                        return newMarkers;
                    }

    and the setinterval function

     var tim=<%= Session["21"] %>;
            setInterval(function(){ initialize();}, tim*1000); 

    Thanks

    Wednesday, September 24, 2014 8:37 AM