Blurred and Overly-Shadowed Sprites

[joris-prl]

Description

Hello,

I'm currently using the flutter-vector-map-tiles package to display a vector map with Maptiler's "streets" style. However, I'm encountering a rendering issue with the sprites, which appear blurred and have an overly strong shadow.

Code

  void _readStyle() async {
    Style lightStyle = await StyleReader(
      uri: 'https://api.maptiler.com/maps/streets-v2/style.json?key={key}',
      apiKey: 'XXXXXXXX',
    ).read();
    this.lightStyle = lightStyle;
  }

        final VectorTileLayer tileLayer = VectorTileLayer(
          theme: lightStyle.theme,
          sprites: lightStyle.sprites,
          tileOffset: TileOffset.DEFAULT,
          tileProviders: lightStyle.providers,
          layerMode: VectorTileLayerMode.vector,
        );

pubspec.yaml (Relevant dependencies only)

dependencies:
  flutter_map: ^6.0.0
  vector_map_tiles: ^7.3.1

Expected Behavior

I expect the sprites to be displayed sharply, without blur or excessive shadow, consistent with the standard appearance of Maptiler's "streets" style.

Screenshot

Question: Do you have any suggestions for resolving this rendering issue? Is this a known problem, or are there specific settings I could adjust to improve the appearance of the sprites?

Thank you in advance for your help!

[greensopinion]

I'm not sure what's happening here. It's working better with the mapbox streets theme, see https://github.com/greensopinion/flutter-vector-map-tiles-examples

To troubleshoot you could look into what's different between the two themes. E.g. does the theme you're using have a different sprites json? This could be a good place to start: https://github.com/greensopinion/dart-vector-tile-renderer/blob/85261f80344ca1d521bacfcb0ef58040720662f7/lib/src/themes/sprite_reader.dart#L8