Skip to content

Olmarkers with html and angular events into the message#220

Open
humaknight wants to merge 4 commits into
tombatossals:masterfrom
humaknight:master
Open

Olmarkers with html and angular events into the message#220
humaknight wants to merge 4 commits into
tombatossals:masterfrom
humaknight:master

Conversation

@humaknight

Copy link
Copy Markdown
Contributor

feat(olMarker): Add compiled angularjs html and events in label message

I added compile directive to the project and change message template. Now you can send html and angular directives inside the message.

I use it for make closable markers

@mfilotto

mfilotto commented Jan 3, 2016

Copy link
Copy Markdown
Contributor

Hi,
Do you have any example on that one please ?

@humaknight

Copy link
Copy Markdown
Contributor Author

@mfilotto with this code you can create a marker with custom html and in this popup you can use ng-click events.

// Javascript

var html = "<div ng-click='hello()'>Hello!</div> ";
var marker = {};
marker.projection = 'EPSG:3857';
marker.lat = lat;
marker.lon = lon;
marker.style = {};
marker.label = {};
marker.label.message = html;
$scope.markers.push(marker);

// HTML

<openlayers ol-center="position" ol-defaults="defaults" ol-controls="controls" custom-layers="true" height="100%">
             <ol-layer ol-layer-properties="layer" ng-repeat="layer in layers"></ol-layer>
             <ol-marker ol-marker-properties="marker" ng-repeat="marker in markers"></ol-marker>
</openlayers>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants