search

greensopinion / flutter-vector-map-tiles

A plugin for `flutter_map` that enables the use of vector tiles.
BSD 3-Clause "New" or "Revised" License
136 stars 67 forks source link

Working example for v2.4.1 #138

Closed roly151 closed 10 months ago

roly151 commented 1 year ago

I have an existing app that I am trying to get working with your plugin for flutter_map. I can only use version 2.4.1 of your plugin & v2.2.0 of flutter_map (without having to significantly rework the app) and wondered if you had a working example of how I can show mapbox vector tiles and a rain layer.

The style/theme link I am using is: https://api.mapbox.com/styles/v1/bom-dc-prod/cl82p806e000b15q6o92eppcb?access_token=ACCESS_TOKEN

And the url for the rain radar layers is: https://api.mapbox.com/v4/bom-dc-prod.rain-prod-LPR-{time}/{z}/{x}/{y}.vector.pbf?access_token=ACCESS_TOKEN

I can get the map showing using the latest version of your plugin (but not sure how to also add the rain radar layer), but if I use 2.4.1 there is no Style class so I’m struggling to get the theme. I’ve been trying to get this working for some time, so would really appreciate your help.

Thankyou!

greensopinion commented 1 year ago

Your best bet may be to reconsider upgrading flutter_map and this plugin to the latest version. Though it will involve rework in your app, it may be less effort and more future-proof than trying to get older versions to work.

If you want to get a Mapbox style to work with 2.4.1, you could back-port StyleReader

To add the rain layer, you could add another layer as a child of FlutterMap, e.g. here https://github.com/greensopinion/flutter-vector-map-tiles/blob/main/example/lib/main.dart#L107 You'd need to figure out how to make the additional layer transparent so that the map layer underneath shows through. If you use a vector tile layer from this plugin, you'd want to have a map style that has no background layer.

A good place to look for examples is the flutter-vector-map-tiles-examples project - thought they are specific to the latest version of this plugin.

greensopinion commented 1 year ago

What did you end up doing?

On Fri, Apr 21, 2023 at 5:52 AM roly151 @.***> wrote:

Closed #138 https://github.com/greensopinion/flutter-vector-map-tiles/issues/138 as completed.

— Reply to this email directly, view it on GitHub https://github.com/greensopinion/flutter-vector-map-tiles/issues/138#event-9067432208, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEKDQ7VBYGVAS7HNZD6HVSDXCJ7KLANCNFSM6AAAAAAWXC2XXA . You are receiving this because you commented.Message ID: <greensopinion/flutter-vector-map-tiles/issue/138/issue_event/9067432208@ github.com>

roly151 commented 1 year ago

I tried to implement as per your advice, but in the end changed to a dedicated mapbox package. I will look to rework the app, but I needed to get a fix out asap. Thankyou very much for the advice though.

greensopinion commented 1 year ago

Sounds good! Thanks for letting me know.

On Sun, Apr 23, 2023 at 7:19 PM roly151 @.***> wrote:

I tried to implement as per your advice, but in the end changed to a dedicated mapbox package. I will look to rework the app, but I needed to get a fix out asap. Thankyou very much for the advice though.

— Reply to this email directly, view it on GitHub https://github.com/greensopinion/flutter-vector-map-tiles/issues/138#issuecomment-1519289578, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEKDQ7UXKAMJADZJYIEPEYLXCXPJVANCNFSM6AAAAAAWXC2XXA . You are receiving this because you commented.Message ID: @.***>

roly151 commented 1 year ago

Hi Again, I finally found time to rework my app and I am now using the latest version of flutter_map and your plugin. I am hoping you can help me understand how to add the rain radar layer. The map loads with the first VectorTileLayer, but the second VectorTileLayer which is loading the rain radar data seems to overwrite the map. You mentioned previously about using a style with a transparent background. I would assume that the style I am using would have this. But I am not experienced enough to know how to find out. I am happy to share my style token privately if you are able to help?

The style/theme link I am using is: https://api.mapbox.com/styles/v1/bom-dc-prod/cl82p806e000b15q6o92eppcb?access_token=ACCESS_TOKEN

And the url for the rain radar layers is: https://api.mapbox.com/v4/bom-dc-prod.rain-prod-LPR-{time}/{z}/{x}/{y}.vector.pbf?access_token=ACCESS_TOKEN

The time is provided by this link: https://api.weather.bom.gov.au/v1/radar/capabilities

greensopinion commented 1 year ago

I'm sorry that I can't look into it right now. Feel free to dig into it yourself! It might help to look for a background layer in the style that you're using, or put a breakpoint here https://github.com/greensopinion/flutter-vector-map-tiles/blob/62b81acd8fe2cde32c436037f8161428aceafb09/lib/src/grid/tile/tile_painter.dart#L69

roly151 commented 1 year ago

Thankyou for the tip, and appreciate your time. The style/theme url I am trying to use includes multiple layers. Is there a way to use a specific fill layer from my style? The layer I need to use is a fill-layer that has an id. Is it possible to reference the id to apply the fill properties provided by that layer to my VectorTileLayer? (Apologies if this is simple or I am not explaining it right. I am still trying to get my head around styles, themes, sources, layers etc).

greensopinion commented 10 months ago

I've provided a multi-layer example: https://github.com/greensopinion/flutter-vector-map-tiles-examples See https://github.com/greensopinion/flutter-vector-map-tiles-examples/blob/main/lib/examples/multi_layer.dart for details.