angulargoogle-mapstypescriptgeolocationangular-google-maps

how to initially zoom a map in angular google maps

I am using agm/core in displaying the coordinates of a map. I have the code below

<agm-map [latitude]="10.3207886" [longitude]="123.90250049999997">
    <agm-marker [latitude]="10.3207886 [longitude]="123.90250049999997"></agm-marker>
</agm-map>

The view is this:

enter image description here

But I want to initially show the streets like this:

enter image description here

How to do that?

Solution

  • Set zoom and center attributes. For example.

    <agm-map zoom="8" [center]="10.3207886, 123.90250049999997">
    <agm-marker [latitude]="10.3207886" [longitude]="123.90250049999997"></agm-marker>
</agm-map>

    center is usually to specify which area you want to concentrate on, according to it change zoom level