nativescript-mapbox showing black Map Markers
Asked Answered
B

2

6

I am having an issue in the android emulator where my svg/icon Layers are showing as black. This sometimes effects highway/road markers as well as my map markers. The plugin is currently using the default marker, but I have also provided my own png file and they both suffer from this problem.

Sometimes zooming in will fix it (as can be seen for one of the markers in the image below)

I am yet to test this on any other device and have only been using an android emulator from android studio.

Black markers on map

Some extra details

I am running nativescript with Angular (and TS), I have commented out any extraneous code that adds markers etc and am still having the issue on highway number markers (example below). Here is my template:

<StackLayout class="page">
    <ContentView height="100%" width="100%">
        <Mapbox
            accessToken="token"
            mapStyle="streets"
            [latitude]=defaultLocation.latitude
            [longitude]=defaultLocation.longitude
            hideCompass="true"
            zoomLevel="8"
            showUserLocation="false"
            disableZoom="false"
            disableRotation="false"
            disableScroll="false"
            disableTilt="false"
            (mapReady)="onMapReady($event)">
        </Mapbox>
    </ContentView>
</StackLayout>

same issue without using custom markers

It seems like I can trigger this with a call to removeMarkers and addMarkers with this code:

updateUserMarker(loc) {
    console.log("updating user location marker with loc: ", loc)
    this.map.removeMarkers([this.userMarker.id]);
    this.userMarker.lat = loc.latitude;
    this.userMarker.lng = loc.longitude;
    this.map.addMarkers([this.userMarker]);
}
Baritone answered 17/5, 2018 at 0:48 Comment(0)
F
2

If you are running this on an emulator then make sure to go to it's settings and select the following : OpenGL ES renderer as "SwiftShader"
OpenGL ES API Level as "Renderer maximum"

and restart the android emulator.

Fakieh answered 4/11, 2020 at 7:34 Comment(1)
It looks like the ANGLE built-in shaders also work. It seems like this is a bug specific to the desktop native OpenGL integration.Heat
E
1

I had the same problem and I removed Android Studio and reinstalled and downloaded a new OS image and it seems to have fixed the problem.

Not sure you still have this issue but thought I would put this here for any new users with the issue as this was the only post I could find relating to this.

Eldaelden answered 3/4, 2019 at 14:31 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.