Skip to content

Commit 0b3f882

Browse files
committed
feat: getLayer + getLayers
1 parent 94ebe11 commit 0b3f882

File tree

5 files changed

+219
-5
lines changed

5 files changed

+219
-5
lines changed

demo/app/main-page.xml

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:map="@nativescript-community/ui-mapbox" actionBarHidden="true" loaded="pageLoaded">
2-
<TabView>
2+
<TabView androidSwipeEnabled="false">
33
<TabView.items>
44

55
<TabViewItem title="Single Map">
@@ -103,7 +103,7 @@
103103

104104
<TabViewItem title="By Code">
105105
<TabViewItem.view>
106-
<GridLayout columns="*, *, *, *" rows="auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, *" horizontalAlignment="stretch" class="tab-content">
106+
<GridLayout columns="*, *, *, *" rows="auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, auto, *" horizontalAlignment="stretch" class="tab-content">
107107

108108
<Button row="0" col="0" text="show" tap="{{ doShow }}" class="button" />
109109
<Button row="0" col="1" text="hide" tap="{{ doHide }}" class="button" />
@@ -150,7 +150,10 @@
150150
<Button row="11" colSpan="2" text="location perm?" tap="{{ doCheckHasFineLocationPermission }}" class="button button-permissions" />
151151
<Button row="11" col="2" colSpan="2" text="ask permission" tap="{{ doRequestFineLocationPermission }}" class="button button-permissions" />
152152

153-
<StackLayout row="12" col="0" colSpan="4">
153+
<Button row="12" col="0" text="get layers" tap="{{ doGetLayers }}" class="button" />
154+
<Button row="12" col="1" text="toggle all layers" tap="{{ doToggleLayers }}" class="button" />
155+
156+
<StackLayout row="13" col="0" colSpan="4">
154157
<ContentView with="100%" height="100%" id="mapContainer" />
155158
</StackLayout>
156159

demo/app/main-view-model.ts

+28
Original file line numberDiff line numberDiff line change
@@ -824,4 +824,32 @@ export class HelloWorldModel extends Observable {
824824
console.log('Fine Location permission requested');
825825
});
826826
}
827+
828+
public doGetLayers(): void {
829+
this.mapbox.getLayers().then((layers) => {
830+
layers.map(l => console.log(l.id));
831+
832+
const alertOptions: AlertOptions = {
833+
title: 'All map style layers',
834+
message: JSON.stringify(layers.map(l => l.id)),
835+
okButtonText: 'OK',
836+
};
837+
alert(alertOptions);
838+
});
839+
840+
this.mapbox.getLayer('waterway').then((waterwayLayer) => {
841+
if (!!waterwayLayer) {
842+
console.log(`getLayer("${waterwayLayer.id}") visible?: ${waterwayLayer.visibility()}`);
843+
}
844+
})
845+
}
846+
847+
public doToggleLayers(): void {
848+
this.mapbox.getLayers().then((layers) => {
849+
const everySecondElement = layers.filter((e, i) => i % 2 === 2 - 1);
850+
everySecondElement.map((layer) => {
851+
layer.visibility() ? layer.hide() : layer.show();
852+
});
853+
});
854+
}
827855
}

src/mapbox.android.ts

+88
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
DownloadOfflineRegionOptions,
2323
Feature,
2424
LatLng,
25+
LayerCommon,
2526
ListOfflineRegionsOptions,
2627
MapStyle,
2728
MapboxApi,
@@ -4249,6 +4250,71 @@ export class Mapbox extends MapboxCommon implements MapboxApi {
42494250

42504251
// ---------------------------------------------------------------
42514252

4253+
getLayer(name: string, nativeMap?: any): Promise<LayerCommon> {
4254+
return new Promise((resolve, reject) => {
4255+
try {
4256+
const theMap = nativeMap || this._mapboxMapInstance;
4257+
4258+
if (!theMap) {
4259+
reject('No map has been loaded');
4260+
return;
4261+
}
4262+
4263+
const styleLoadedCallback = new com.mapbox.mapboxsdk.maps.Style.OnStyleLoaded({
4264+
onStyleLoaded: (style) => {
4265+
const layer = style.getLayer(name);
4266+
console.log('layer :', layer);
4267+
resolve(layer ? new Layer(layer) : null);
4268+
},
4269+
});
4270+
4271+
theMap.getStyle(styleLoadedCallback);
4272+
} catch (ex) {
4273+
if (Trace.isEnabled()) {
4274+
CLog(CLogTypes.info, 'Error in mapbox.getLayer: ' + ex);
4275+
}
4276+
reject(ex);
4277+
}
4278+
});
4279+
}
4280+
4281+
// ----------------------------------------------------------------------------------
4282+
4283+
getLayers(nativeMap?: any): Promise<Array<LayerCommon>> {
4284+
return new Promise((resolve, reject) => {
4285+
try {
4286+
const theMap = nativeMap || this._mapboxMapInstance;
4287+
4288+
if (!theMap) {
4289+
reject('No map has been loaded');
4290+
return;
4291+
}
4292+
4293+
const styleLoadedCallback = new com.mapbox.mapboxsdk.maps.Style.OnStyleLoaded({
4294+
onStyleLoaded: (style) => {
4295+
const layers = style.getLayers();
4296+
const result: Layer[] = [];
4297+
4298+
for (let i = 0; i < layers.size(); i++) {
4299+
result.push(new Layer(layers.get(i)));
4300+
}
4301+
4302+
resolve(result);
4303+
},
4304+
});
4305+
4306+
theMap.getStyle(styleLoadedCallback);
4307+
} catch (ex) {
4308+
if (Trace.isEnabled()) {
4309+
CLog(CLogTypes.info, 'Error in mapbox.getLayers: ' + ex);
4310+
}
4311+
reject(ex);
4312+
}
4313+
});
4314+
}
4315+
4316+
// ---------------------------------------------------------------
4317+
42524318
_getClickedMarkerDetails(clicked) {
42534319
for (const m in this._markers) {
42544320
const cached = this._markers[m];
@@ -4666,4 +4732,26 @@ export class Mapbox extends MapboxCommon implements MapboxApi {
46664732
}
46674733
} // end of class Mapbox
46684734

4735+
export class Layer implements LayerCommon {
4736+
public id: string;
4737+
private instance: any;
4738+
4739+
constructor(instance: any) {
4740+
this.instance = instance;
4741+
this.id = instance.getId();
4742+
}
4743+
4744+
public visibility(): boolean {
4745+
return this.instance.getVisibility().getValue() === 'visible' ? true : false;
4746+
}
4747+
4748+
public show(): void {
4749+
this.instance.setProperties([new com.mapbox.mapboxsdk.style.layers.PropertyValue('visibility', 'visible')]);
4750+
}
4751+
4752+
public hide(): void {
4753+
this.instance.setProperties([new com.mapbox.mapboxsdk.style.layers.PropertyValue('visibility', 'none')]);
4754+
}
4755+
}
4756+
46694757
// END

src/mapbox.common.ts

+24-2
Original file line numberDiff line numberDiff line change
@@ -482,6 +482,15 @@ export interface AnimateCameraOptions {
482482

483483
// ------------------------------------------------------------
484484

485+
export interface LayerCommon {
486+
id: string;
487+
visibility(): boolean;
488+
show(): void;
489+
hide(): void;
490+
}
491+
492+
// ------------------------------------------------------------
493+
485494
export interface MapboxCommonApi {
486495
requestFineLocationPermission(): Promise<any>;
487496

@@ -615,6 +624,10 @@ export interface MapboxApi {
615624

616625
addGeoJsonClustered(options: AddGeoJsonClusteredOptions): Promise<any>;
617626

627+
getLayer(name: string, nativeMap?: any): Promise<LayerCommon>;
628+
629+
getLayers(nativeMap?: any): Promise<Array<LayerCommon>>;
630+
618631
// addSource(options: AddSourceOptions): Promise<any>;
619632

620633
// addExtrusion(options: AddExtrusionOptions): Promise<any>;
@@ -758,6 +771,10 @@ export interface MapboxViewApi {
758771

759772
animateCamera(options: AnimateCameraOptions): Promise<any>;
760773

774+
getLayer(name: string, nativeMap?: any): Promise<LayerCommon>;
775+
776+
getLayers(nativeMap?: any): Promise<Array<LayerCommon>>;
777+
761778
destroy(): Promise<any>;
762779

763780
onStart(): Promise<any>;
@@ -793,7 +810,7 @@ export abstract class MapboxViewCommonBase extends ContentView implements Mapbox
793810

794811
protected mapbox: MapboxApi;
795812

796-
telemetry:boolean
813+
telemetry: boolean;
797814

798815
abstract getNativeMapView(): any;
799816
/**
@@ -803,7 +820,6 @@ export abstract class MapboxViewCommonBase extends ContentView implements Mapbox
803820
*/
804821

805822
public onMapEvent(eventName, id, callback): void {
806-
807823
return this.mapbox.onMapEvent(eventName, id, callback, this.getNativeMapView());
808824
}
809825
public offMapEvent(eventName, id): void {
@@ -917,6 +933,12 @@ export abstract class MapboxViewCommonBase extends ContentView implements Mapbox
917933
animateCamera(options: AnimateCameraOptions): Promise<any> {
918934
return this.mapbox.animateCamera(options, this.getNativeMapView());
919935
}
936+
getLayer(name: string, nativeMap?: any): Promise<LayerCommon> {
937+
return this.mapbox.getLayer(name, nativeMap);
938+
}
939+
getLayers(nativeMap?: any): Promise<Array<LayerCommon>> {
940+
return this.mapbox.getLayers(nativeMap);
941+
}
920942
destroy(): Promise<any> {
921943
return this.mapbox.destroy(this.getNativeMapView());
922944
}

src/mapbox.ios.ts

+73
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ import {
3333
UserLocationCameraMode,
3434
Viewport,
3535
telemetryProperty,
36+
LayerCommon,
3637
} from './mapbox.common';
3738

3839
import { GeoUtils } from './geo.utils';
@@ -3078,6 +3079,55 @@ export class Mapbox extends MapboxCommon implements MapboxApi {
30783079
}
30793080
});
30803081
}
3082+
3083+
getLayer(name: string, nativeMap?: any): Promise<LayerCommon> {
3084+
return new Promise((resolve, reject) => {
3085+
try {
3086+
const theMap: MGLMapView = nativeMap || this._mapboxViewInstance;
3087+
3088+
if (!theMap) {
3089+
reject('No map has been loaded');
3090+
return;
3091+
}
3092+
3093+
const layer = theMap.style.layerWithIdentifier(name);
3094+
3095+
resolve(new Layer(layer));
3096+
} catch (ex) {
3097+
if (Trace.isEnabled()) {
3098+
CLog(CLogTypes.info, 'Error in mapbox.getLayer: ' + ex);
3099+
}
3100+
reject(ex);
3101+
}
3102+
});
3103+
}
3104+
3105+
getLayers(nativeMap?: any): Promise<Array<LayerCommon>> {
3106+
return new Promise((resolve, reject) => {
3107+
try {
3108+
const theMap: MGLMapView = nativeMap || this._mapboxViewInstance;
3109+
3110+
if (!theMap) {
3111+
reject('No map has been loaded');
3112+
return;
3113+
}
3114+
3115+
const layers = theMap.style.layers;
3116+
const result: Layer[] = [];
3117+
3118+
for (let i = 0; i < layers.count; i++) {
3119+
result.push(new Layer(layers[i]));
3120+
}
3121+
3122+
resolve(result);
3123+
} catch (ex) {
3124+
if (Trace.isEnabled()) {
3125+
CLog(CLogTypes.info, 'Error in mapbox.getLayers: ' + ex);
3126+
}
3127+
reject(ex);
3128+
}
3129+
});
3130+
}
30813131
}
30823132

30833133
const _addObserver = (eventName, callback) => NSNotificationCenter.defaultCenter.addObserverForNameObjectQueueUsingBlock(eventName, null, NSOperationQueue.mainQueue, callback);
@@ -3606,3 +3656,26 @@ class MapSwipeHandlerImpl extends NSObject {
36063656
swipe: { returns: interop.types.void, params: [interop.types.id] },
36073657
};
36083658
}
3659+
3660+
export class Layer implements LayerCommon {
3661+
public id: string;
3662+
private instance;
3663+
3664+
constructor(instance) {
3665+
this.instance = instance;
3666+
this.id = instance.identifier;
3667+
}
3668+
3669+
visibility(): boolean {
3670+
return this.instance.visible;
3671+
}
3672+
3673+
show(): void {
3674+
this.instance.visible = true;
3675+
}
3676+
3677+
hide(): void {
3678+
this.instance.visible = false;
3679+
}
3680+
}
3681+

0 commit comments

Comments
 (0)