Google map not centred or zoomed at latitude and longitude specified


#1

I followed the steps in the {N} Google Maps SDK Plugin to show a map on an Android device.
I faced few issues but luckily I found solutions on the following links


The issue that I have now is that the map is displayed but it is not centred or zoomed at the coordinates specified.
I am not able to find a proper working fix for this issue.

Below is my map-xml code

<GridLayout xmlns:maps="nativescript-google-maps-sdk" class="page-content" loaded="onLoaded">
    <maps:mapView latitude="25.379843" longitude="51.531874" 
    padding="50,50,50,50" zoom="1000" mapReady="onMapReady" cameraChanged="onCameraChanged"/>
</GridLayout>

Here is the corresponding JS code

const BrowseViewModel = require("./browse-view-model");
var mapsModule = require("nativescript-google-maps-sdk");

function onLoaded(args) {
    const component = args.object;
    component.bindingContext = new BrowseViewModel();
}

function onMapReady(args) {
    var mapView = args.object;
  
    console.log("Setting a marker...");
    var marker = new mapsModule.Marker();
    marker.position = mapsModule.Position.positionFromLatLng(25.379843, 51.531874);
    marker.title = "Ritz-Carlton";
    marker.snippet = "Doha";
    marker.userData = { index : 1};
    mapView.addMarker(marker);
    
    // Disabling zoom gestures
   // mapView.settings.zoomGesturesEnabled = false;
  }
  var lastCamera = null;
  function onCameraChanged(args) {
    var mapView = args.object;
    console.log("Camera changed: "+JSON.stringify(args.camera), JSON.stringify(args.camera) === lastCamera);
    lastCamera = JSON.stringify(args.camera);
    var bounds = mapView.projection.visibleRegion.bounds;
    console.log("Current bounds: " + JSON.stringify({
          southwest: [bounds.southwest.latitude, bounds.southwest.longitude],
          northeast: [bounds.northeast.latitude, bounds.northeast.longitude]
        }));
  }   
exports.onMapReady = onMapReady;
exports.onLoaded = onLoaded;
exports.onCameraChanged = onCameraChanged;

Could you please help me identify the mistake or the missing part

Thanks a lot


#2

Are you asking about adjusting the zoom level and center map in a way where all markers should be visible?


#3

I have only one marker and the marker is visible and placed at the correct location.
My problem is that the map is not zoomed in appropriately.
To be very clear , the location that I have set in the map is in Doha.
But the map shows all of the African continent the middle east and part of Asian continent on the screen.
I want only Doha zoomed in and displayed on the screen.
I am not sure if I was able to explain properly as I don’t know the exact technical term used for this , is it zooming in or center the position at the specified location


#4

What is visible is this------------------------------------------What I am trying to get is this


#5

Just apply the same lat and long to map view. But if you have multiple markers and want to center and zoom properly, follow up here