How to update map marker in angular application

Question

So i have created this small map application HERE, and as you can see it shows your current localtion, now the problem is the marker will not show on the current location, If you CTRL+U you will see that the code for the marker is:

<openlayers ol-center="center"  height="400px">
            <ol-marker lat="center.lat" lon="center.lon" message="Your current location." ng-model="center" >
            </ol-marker>
</openlayers>

The lat="center.lat" and lon="center.lon" in the beginning is 0 , now if i hardcode the values of lat and lon to my current location , ofcourse the marker will show in my current location, but how do i update the values dynamically ?

I am using angular.js , openLayers3 and openlayers-angular-directive , So to repeat my question, how do i update the marker dynamically ?

Answer 1

All you need is to add "autodiscover : true" to your center object in your controller.

As it is explained in the documentation of the directive.

Also, you need to put the value bound in the marker:

<openlayers ol-center="center"  height="400px">
        <ol-marker lat="{{center.lat}}" lon="{{center.lon}}" message="Your current location." ng-model="center" >
        </ol-marker>

Answer 2

Use $timeout instead of setTimeout. Angular doesn't know you are modifying the scope inside setTimeout so it doesn't update the view.

$timeout uses setTimeout() internally but also calls $apply() to have angular run a digest.

rememeber to also inject it in controller

Answer 3

you can try

<ol-marker ol-marker-properties="center" ></ol-marker>

angular.extend($scope, {
            center: {
                lat: 0,
                lon: 0,
                autodiscover: true
                label: {
                    message: 'Your current location.',
                    show: true,
                    showOnMouseOver: true
                }
            }
        });

Answer 4

good example with code to work with map in angular JS

http://ngmap.github.io/drawings.html