Comments (7)
Hi @siddmegadeth!
If you look at your controller declaration, you have more parameters than the definition:
app.controller('landingCtrl', ['$scope', '$rootScope', '$timeout', '$http', 'mapboxglMapsData', function($scope, $rootScope, $timeout, journey, $http, mapboxglMapsData) {
// ...
}]);
You missed the journey
variable.
from angular-mapboxgl-directive.
Hi @idanb11!
Thanks for use my directive!
You can get the Mapbox GL instance using mapboxglMapsData
factory, like:
<div mapboxgl id="myMap"></div>
app.controller('MyController', ['mapboxglMapsData', function (mapboxglMapsData) {
var mapInstance = mapboxglMapsData.getMapById('myMap');
// now, you have the Mapbox GL map instance
}]);
I hope I have helped you, tell me if you need something more!
from angular-mapboxgl-directive.
Thank you for your quick response...
cheers,
from angular-mapboxgl-directive.
app.controller('MyController', ['mapboxglMapsData', function (mapboxglMapsData) { var mapInstance = mapboxglMapsData.getMapById('myMap'); // now, you have the Mapbox GL map instance }]);
Why is this always null for me? What could I possibly be doing wrong?
from angular-mapboxgl-directive.
Hi @kalabalik!
Thanks for use my directive.
Sorry, in a controller you have to wait to the load map event, like:
app.controller('MyController', ['mapboxglMapsData', function (mapboxglMapsData) {
$scope.$on('mapboxglMap:load', function (event, mapboxglMapEvent) {
$scope.mapInstance = mapboxglMapsData.getMapById('myMap');
});
}]);
Tell me if it worked, @kalabalik!
from angular-mapboxgl-directive.
Well thank YOU, for writing the directive in the first place!
It did work! And I feel a little bit embarrassed that I did not come up with the code by myself. In fact, I was playing around with an angular event, but didn't know what it was called. However, if one looks closer, it is all there.
from angular-mapboxgl-directive.
I am getting undefined for mapboxglMapsData
Any Suggestion
app.controller('landingCtrl', ['$scope', '$rootScope', '$timeout', '$http', 'mapboxglMapsData', function($scope, $rootScope, $timeout, journey, $http, mapboxglMapsData) {
$scope.glControls = {
geolocate: {
enabled: true,
options: {
position: 'top-left'
}
},
geocoder: {
enabled: true,
options: {
position: 'top-right',
accessToken: mapboxgl.accessToken
}
},
directions: {
enabled: true,
options: {
position: 'top-left',
accessToken: mapboxgl.accessToken
}
}
};
$scope.$on('mapboxglMap:load', function(event, mapboxglMapEvent) {
log("Map Loaded");
log(event);
log(mapboxglMapEvent);
log(mapboxglMapsData);
$scope.mapInstance = mapboxglMapsData.getMapById('myMap');
});
// mapBoxServices.addControls($scope.glControls);
}]);
from angular-mapboxgl-directive.
Related Issues (20)
- Navigation control does not work HOT 4
- Invalid source ID HOT 1
- Markers lose its position during scroll HOT 6
- How can I use an image as an icon-image for the 'unclustered-point' layer? HOT 1
- Map doesn't handle data changes after any events HOT 2
- Save and load polygon drawn with mapbox draw tool
- Angular 2 Support? HOT 3
- Question: Clean source and layer HOT 3
- How to get information about the line which was clicked? HOT 6
- Map events are not $broadcast inside an $apply HOT 3
- Leaflet Instance HOT 1
- A way to set map dimensions
- Help need to retrieve zoom level HOT 1
- Question: Is there a simple way to get a reference to the underlying map? HOT 3
- click event for custom markers
- How do I get bounds of the current map HOT 1
- Broken Example Link
- Directions control doesn't show path
- Whether to support the mapbox latest version
- Fullscreen button
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angular-mapboxgl-directive.