mapbox / mapbox-gl-native

Interactive, thoroughly customizable maps in native Android, iOS, macOS, Node.js, and Qt applications, powered by vector tiles and OpenGL
https://mapbox.com/mobile
Other
4.35k stars 1.33k forks source link

Flickering Symbols #16473

Closed mrfaa closed 4 years ago

mrfaa commented 4 years ago

Platform: Android Mapbox SDK version: 9.2.1

Steps to trigger behavior

I made a clear Mapbox Demo App with nothing more than the basic setup: getting the map Instance, set a style, put some Symbols on the map (with SymbolOptions) and finally set the camera position.

When i set a tilt option to the CameraPosition the symbols are flickering at creation. See the video: https://nx5212.your-storageshare.de/s/KfTM9N2joDzA5Hi

When I don't use the tilt option, then nothing flickers. See the video: https://nx5212.your-storageshare.de/s/tFEirbMconK9g73

Any thoughts about this behavior?

Also there are problems in iOS (5.8.0) - it's maybe the same behavior: https://github.com/mapbox/mapbox-gl-native-ios/issues/273 Maybe related with: https://github.com/mapbox/mapbox-gl-native/issues/16471

Thanks!

Best regards Fabian

Expected behavior: The symbols are not flickering at creation time. Actual behavior: Icons are flickering.

chloekraw commented 4 years ago

Thanks for reporting this. We expect this issue to be resolved in the next minor release and will update you when a release is available for you to test and confirm the fix.

cerisier commented 4 years ago

@chloekraw Thanks for the heads up. Any ETA for this ? If you have the commit already somewhere is it possible to have it before the new release to mitigate this issue for our users ?

chloekraw commented 4 years ago

Hi @cerisier, Maps SDK Android v9.3.0 and iOS v6.0.0 contain a fix. You can download this release by following the instructions on the platform repos (Android | iOS) or our mobile documentation guide (Android | iOS). Let us know if the issue persists for you after trying the latest release.

florianPOLARSTEPS commented 4 years ago

Hey @chloekraw. I can confirm it is fixed in the latest release. Thanks!

mrfaa commented 3 years ago

Hi @chloekraw i updated the Android SDK (9.3.0) but unfortunately i'm experiencing the same issue like described above (#16473).

Any thoughts about this behavior?

Jackhammer42 commented 3 years ago

Hey @chloekraw, I still do see same issue on iOS as well, even in the newest release 6.0.0. I already opened an issue (mapbox/mapbox-gl-native-ios#273), where I nailed down the affected iOS Versions: 5.5.0 to 6.0.0

pozdnyakov commented 3 years ago

@mrfaa @Jackhammer42 does the symbol flickering still depend on the tilt?

mrfaa commented 3 years ago

In Android it still depends on the tilt. I again built a new mapbox demo app from scratch, like mentioned above. With the Android SDK 9.3.0

By setting the tilt level the icons are flickering. Here is the code to reproduce:

private MapView mapView;
    private SymbolManager symbolManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Mapbox.getInstance(this, getString(R.string.mapbox_access_token));

        setContentView(R.layout.activity_main);

        mapView = (MapView) findViewById(R.id.mapView);
        mapView.onCreate(savedInstanceState);
        mapView.getMapAsync(new OnMapReadyCallback() {
            @Override
            public void onMapReady(@NonNull final MapboxMap mapboxMap) {

                mapboxMap.setStyle(Style.MAPBOX_STREETS, new Style.OnStyleLoaded() {
                    @Override
                    public void onStyleLoaded(@NonNull Style style) {
                        final int resourceId = getApplicationContext().getResources().getIdentifier("marker", "drawable", getApplicationContext().getPackageName());

                        style.addImage("marker",
                                BitmapFactory.decodeResource(getApplicationContext().getResources(), resourceId));

                        symbolManager = new SymbolManager(mapView, mapboxMap, style);
                        symbolManager.setIconAllowOverlap(true);
                        symbolManager.setIconIgnorePlacement(true);
                        symbolManager.setTextIgnorePlacement(true);

                        final CameraPosition cameraPosition = new CameraPosition.Builder()
                                .target(new LatLng(48.85819, 2.29458))
                                .zoom(18)
                               // .tilt(7)                   // Sets the tilt of the camera
                                .bearing(0)
                                .build();                   // Creates a CameraPosition from the builder

                        mapboxMap.setCameraPosition(cameraPosition);

                        final SymbolOptions symbolOptions1 = new SymbolOptions()
                                .withLatLng(new LatLng(48.85819, 2.29458))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions1);

                        final SymbolOptions symbolOptions2 = new SymbolOptions()
                                .withLatLng(new LatLng(48.8582, 2.2942))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions2);

                        final SymbolOptions symbolOptions3 = new SymbolOptions()
                                .withLatLng(new LatLng(48.8583, 2.2943))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions3);

                        final SymbolOptions symbolOptions4 = new SymbolOptions()
                                .withLatLng(new LatLng(48.8584, 2.2944))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions4);

                        final SymbolOptions symbolOptions5 = new SymbolOptions()
                                .withLatLng(new LatLng(48.8585, 2.2945))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions5);

                        final SymbolOptions symbolOptions6 = new SymbolOptions()
                                .withLatLng(new LatLng(48.8586, 2.2946))
                                .withIconImage("marker");
                        symbolManager.create(symbolOptions6);
                    }
                });

            }
        });
    }

    @Override
    protected void onStart() {
        super.onStart();
        mapView.onStart();
    }

    @Override
    protected void onResume() {
        super.onResume();
        mapView.onResume();
    }

    @Override
    protected void onPause() {
        super.onPause();
        mapView.onPause();
    }

    @Override
    protected void onStop() {
        super.onStop();
        mapView.onStop();
    }

    @Override
    protected void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        mapView.onSaveInstanceState(outState);
    }

    @Override
    public void onLowMemory() {
        super.onLowMemory();
        mapView.onLowMemory();
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        mapView.onDestroy();
    }
}`
Jackhammer42 commented 3 years ago

Hey @pozdnyakov,

i created an iOS sample project (Mapbox version 6.0.0) to illustrate the problem. As far as i can tell, the behaviour occures more regulary when pitch (tilt) != 0, compared to pitch == 0.

To showcase this, I added two buttons to hide/show the annotations. The flicker occures after adding the annoations to the map. Maybe you have to try a few cycles, it does not happen every time but still quite often.

(Install Mapbox via cocoapods and add your own key)

Download

janweigel commented 3 years ago

@tobrun could you please reopen that issue as the bug obviously still occurs in the latest release and is not fixed yet. Thank you