Hello !

I am adding two custom control maps on the top right of the map:

        /***********************************************/
        var homeControlDiv = document.createElement('DIV');
        var homeControl = new TrafficControl(homeControlDiv, map);

        var customMapsControlDiv = document.createElement('DIV');
        var customMapsControl = new customControlMap(customMapsControlDiv,
map);

        
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(homeControlDiv);
        
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(customMapsControlDiv);
        /***********************************************/

where TrafficControl is a control that changes its text when is
clicked. The problem is that it changes to a longer text, and the
control increase it size (that's ok), but it happens that the control
gets under the other control. The one which is on the left.

When you change the zoom, both controls are repositioned and displayed
correctly. I wonder if there is a ControlMap property or method I
could call when I click in the control, to reposition them as it is
done when yoy change the zoom.

Thanks !!

        /**********************************************/
        function TrafficControl(controlDiv, map) {

              controlDiv.style.padding = '5px 0px';
              var controlUI = document.createElement('DIV');
              controlUI.style.backgroundColor = 'white';
              controlUI.style.borderStyle = 'solid';
              controlUI.style.borderWidth = '2px';
              controlUI.style.cursor = 'pointer';
              controlUI.style.textAlign = 'center';
              controlDiv.appendChild(controlUI);


              var legend = document.createElement('div');
              legend.id = "mapControlTraffic";
              legend.style.display = "none";
              legend.innerHTML = "Hi";
              var controlText = document.createElement('DIV');
              var controlTextHeader = document.createElement('DIV');
              controlTextHeader.innerHTML = 'Show';
              controlText.appendChild(controlTextHeader);
              controlText.appendChild(legend);

              controlUI.appendChild(controlText);

              google.maps.event.addDomListener(controlTextHeader,
'click', function() {
 
if(window.document.getElementById('mapControlTraffic').style.display=='none')
{
                        // Estaba oculto, se muestra
 
window.document.getElementById('mapControlTraffic').style.display='';
                       controlTextHeader.innerHTML = 'Hide traffic';
                       //trafficLayer.setMap(map);
                    }else{
 
window.document.getElementById('mapControlTraffic').style.display='none';
                        controlTextHeader.innerHTML = 'Show';
                        //trafficLayer.setMap(null);
                    }
              });
            }
        /**********************************************/

-- 
You received this message because you are subscribed to the Google Groups 
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/google-maps-js-api-v3?hl=en.

Reply via email to