Skip to content
This repository was archived by the owner on Nov 30, 2018. It is now read-only.
This repository was archived by the owner on Nov 30, 2018. It is now read-only.

Closing Info Window prevents them from opening again on same marker #548

@mkandefer

Description

@mkandefer

I've defined a reuseable window directive that I show and hide based on map interaction with my markers and polygons.

<window 
   show="addressInfo.show"
   coords="addressInfo.coords"
   >
     <div class="outage-info" ng-controller='OutageMapController' > 
        <h3>{{addressInfo.header}}</h3>
         ...                        
     </div>
</window>

When the map registers a click event on the marker I populate the addressInfo and show the window over the marker. Markers are created using the controller and standard javascript API calls. When the user clicks off the window or on another marker I hide the first window by setting $scope.addressInfo.show = false, and move and re-show the window if they clicked on a different marker. This works fine and allows for the window to be reopened. However, if the user clicks the 'x' button in the info window they cannot open it again if they interact with the same map object. If they click on another object the window opens just fine. If they click on the first object again after doing so, the window opens just fine. It is only when they close the window and try to open the window again in the same location that it stops working.

I'm thinking of just hiding the close button (is that possible through the API?), as I don't need it with the click-off the window feature for closing.

Edit: Markers are created in the controller as follows:

function addAddress(address) {
                var position = toLatLng(address.latitude, address.longitude);
                var marker = new google.maps.Marker({
                    position: position,
                    icon: 'images/home.png'
                });

                $scope.infoListener = google.maps.event.addListener(marker, 'click', function (e) {
                    //alert the index of the polygon
                    $scope.safeApply(function () {
                        $scope.addAddressInfoWindow(address, position);
                    });
                });

                marker.setMap($scope.mapObject);
}

$scope.addAddressInfoWindow = function(address, position, marker) {
                // Allow only one info box to be open
                clearInfo();
                $scope.addressInfo = {
                    coords: {
                        latitude: position.lat(),
                        longitude: position.lng()
                    },
                    header: address.name,
                    show: true,
                    account: address.account
                };
}

// Clears the three info windows that may be opened. They are created similarly to address, 
// but contain different layouts and information
 function clearInfo() {
                $scope.outageInfo.show = false;
                $scope.addressInfo.show = false;
                $scope.searchInfo.show = false;
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions