using URL (google or osm)

[john murray]

I apologise if this is astupid question but Im trying to call up a zoomed google (or osm) map tile

I've now got the syncfusion google sample to work but it is singularly useless as showing what is going on and how to progress with it.   It simply calls up a world map which cant zoom or pan 

Question  (no 1 stupid - sorry if the answer I cant see is obvious) 

this url is passed to the layer 

"https://mt0.google.com/vt/lyrs=y&x={x}&y={y}&z={z}"

Clearly x is horixontal coord and Y is vertical and z is zoom level 

Does one therefore replace the x,y,z in above string with absolutes if you want it to focus on a given local area?

if I enter 

 this.layer.Center.Latitude = 49;

 this.layer.Center.Longitude = -2.5;

nothing happens - world map disappears and I simply get a blank screen 

if either of the following lines are enabled the app falls over before starting 

    //this.layer.ZoomPanBehavior.EnableZooming=true;

    //this.layer.ZoomPanBehavior.EnablePanning = true;

I can see no property for layer which sets zoom level

I'd really like some help here - Im at a brick wall - the sample is pretty but teaches and does nothing zooming, panning and localising are what maps are all about 

John

ps I tend to do my programming in c#  code behind rather than xaml 

[Vishal Omprasad]

Hi John,

Regarding “to call up a zoomed google map tile”:

In the .NET MAUI SfMaps control, to zoom a map at a specific latitude and longitude coordinate you have to use the MapTileLayer.Center property and MapZoomPanBehavior.ZoomLevel property, as shown in the following code snippet.

[XAML]:

<map:SfMaps.Layer>

    <map:MapTileLayer x:Name="layer">

        <map:MapTileLayer.Center>

            <map:MapLatLng Latitude="49"

                           Longitude="-2.5" />

        </map:MapTileLayer.Center>

        <map:MapTileLayer.ZoomPanBehavior>

            <map:MapZoomPanBehavior x:Name="mapZoomPanBehavior"

                                    ZoomLevel="5" />

        </map:MapTileLayer.ZoomPanBehavior>

           

    </map:MapTileLayer>

</map:SfMaps.Layer>

(or)

[C#]:

public MainPage()

{

    InitializeComponent();

 

    this.layer.UrlTemplate = "https://mt0.google.com/vt/lyrs=y&x={x}&y={y}&z={z}";

 

    this.layer.Center.Latitude = 49;

    this.layer.Center.Longitude = -2.5;

 

    this.layer.ZoomPanBehavior= new MapZoomPanBehavior(){

        ZoomLevel = 5

    };

 

}

Please refer to the following UG link to know more about Center and ZoomLevel in SfMaps control:

• Center - https://help.syncfusion.com/maui/maps/tile-layer#changing-the-center-latitude-and-longitude

• ZoomLevel - https://help.syncfusion.com/maui/maps/zoom-pan#customizing-the-zoom-level

We have also attached a workable example sample below for your reference.

We hope that this helps you. Please let us know if you need further assistance.

Regards,

Vishal O.

Attachment: GoogleMap_27555c0c.zip