Skip to content
This repository has been archived by the owner on May 11, 2020. It is now read-only.

How to hide or remove dynamically added marker in Ngmap #553

Closed
Thilak8654 opened this issue Mar 31, 2016 · 4 comments
Closed

How to hide or remove dynamically added marker in Ngmap #553

Thilak8654 opened this issue Mar 31, 2016 · 4 comments

Comments

@Thilak8654
Copy link

I have a form along with the map(ngMap), After filling the form and inserting the marker on map, if i click submit it will save. but again if i go to add one more, the marker will be already there at the place of previous co-ordinates. if i reload the page manually, the marker will gone out of map. how to remove or hide without manual reloading of page.

 <ng-map zoom="13" center="{{coordinates.lat}},{{coordinates.lng}}" map-type-id="TERRAIN">
                    <marker></marker>
                    <shape name="polygon" on-click="drawPolygon()" paths={{rectangle}} stroke-color="#ff3232" stroke-opacity="0.8" stroke-weight="2" fill-color="#ff4c4c" fill-opacity="0.35">
                    </shape>
                    <drawing-manager on-overlaycomplete="insertMarker()" drawing-control-options="{position: 'TOP_CENTER',drawingModes:['marker']}" markerOptions="{icon:'http://www1.durban.gov.za/beachwater/images/markers/orange-dot.png'}" drawingControl="true" drawingMode="null">
                    </drawing-manager>
                </ng-map>`

Controller

 $scope.drawingControlOptions = { 
        position: 'TOP_CENTER',
        drawingModes: ['polygon', 'marker']
    };
    $scope.placesCounter = 0;
    $scope.insertMarker = function(e) {
        if (e.type == google.maps.drawing.OverlayType.MARKER) {
            $scope.placesCounter++;
            if ($scope.placesCounter > 1)
                e.overlay.setMap(null); //disable marker from diplaying ..
            var pos = e.overlay.getPosition();
            $scope.markercoordinates = pos.toString();
        }
    };

and also i have tried like this in success promise, but didn't work

`$scope.positions= [];
place.coordinates=$scope.positions[0];`

and as i have used ui-router, i tried to reload the page programmaticaly like this $state.transitionTo('dashboard.places.list', null, { reload: true, inherit: false, notify: true });
that also didn't work. This is the stack over flow question i asked. SO could you please help me

@allenhwkim
Copy link
Owner

This happens because map instance is shared across the page; before submit and after submit.
If you add a marker with javascript, without using <marker> tag. You also need to remove it manually.

I wish I can come up with an easy solution for this

@Thilak8654
Copy link
Author

Thank you for your response. and i will be waiting for your solution for this

@allenhwkim
Copy link
Owner

This has been fixed with 1.17.1 Please try again

@harikakani
Copy link

can you please address me how to hide polylines drawn in ng-map.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants