CODEWITHSUNDEEP
nativescriptmapboxangular2-nativescriptnativescript-plugin
Rohan
Rohan

Reputation: 456

nativescript-mapbox making use of the native MapView object

Final Edit

I've found the correct documentation, and can inspect the MapView instance and mapboxMap to see available functions.

However I'm still not clear on how to actually use the SDK from within JavaScript, for example using mapboxMap.addLayer(layer: Layer). How do I make a new Layer?

So any tips on how to use a native SDK from within my angular/nativescript app would be lovely.

Original Question

I need a bit more control over my Mapbox plugin in my NativeScript project (I need to implement clustering, custom popups, custom (moveable) markers etc) and nativescript-mapbox doesn't provide convenience methods for this.

According to the documentation, the onMapReady event is meant to return a reference to the native MapView object under args.ios || args.android however when I inspect this object via logging, it appears to just be a string.

com.mapbox.mapboxsdk.maps.MapView{14ffde6 VFED..CL. ........ 0,0-1080,1584}

I've tried referencing parameters that I feel should be present on it (by reading the Mapbox SDK documentation) and yet nothing appears to be defined.

So my question is this, how exactly do I go about accessing the native MapView instance within my code, so that I can take full advantage of the SDK to have greater control over the plugin?

Some examples on how I might perform a simple action, such as create a MapMarker would be extremely helpful!

Edit

Based on the comments, I investigated the instance com.mapbox.mapboxsdk.maps.MapView with console.dir() and was given a long list of available functions. However these aren't lining up with what is available in the docs over here.

I'm clearly not understanding something, but feel like I'm close. Can anyone help me with my missing link here?

Some questions I'm trying to answer; why are the docs I've found different from the methods available on this instance. How can I go about doing some (seemingly) simple things like adding or modifying a marker or symbol layer?

Edit 2

I think I just figured it out, I was inspecting a MapView instance, which has a property called mapboxMap, I was looking at the documentation for mapboxMap and wondering why it wasn't lining up with the MapView instance.

So just use console.dir(nativeMapView.mapboxMap) and you'll see it has the methods required to manipulate the map!

Upvotes: 0

Views: 609

Answers (1)

Brad Martin
Brad Martin

Reputation: 6177

com.mapbox.mapboxsdk.maps.MapView{14ffde6 VFED..CL. ........ 0,0-1080,1584} that is an instance, not sure on the logging as a 'string' but you could try `const x = args.android// the instance you are getting; console.dir(x) and see what logs, you should see methods, members, etc.

As for the type when it's logged, it's giving you the type but it's on the namespace of the full class, so com.mapbox...MapView is your type for the instance you are logging. You can do the same with other layouts/views in NativeScript. Add a console.log(something) where something is a ref to a layout or view (button, label) and you'll see the same. So on that instance you'll have access to whatever the SDK provides. Hope that helps.

Upvotes: 2

Related Questions