0

I'm trying to add the layering view from Google Maps in my application. The Application is running on Angular 14.1, I'm using DevExtreme and AGM (Angular Google Maps). I want to add the layering view, that is in the Google Maps with the idea to change the view from Satellite to Traffic for example and I want to look exactly in the same way like it's in Google Maps. Google Maps Layers View

This is the HTML of the component.

<dx-popup
    *ngIf="showMapPopUpVisible"
    [(visible)]="showMapPopUpVisible"
    [width]="800"
    [height]="'auto'"
    [maxHeight]="600"
    [fullScreen]="appContext.isMobileMode"
    [hideOnOutsideClick]="true"
    [showCloseButton]="true"
    [title]="resKeys.strOrderShowAddressesOnMap | translate"
>
    <agm-map
        [latitude]="latitude"
        [longitude]="longitude"
        [zoomControl]="true"
        [mapTypeControlOptions]="mapTypeControlOptions"
        [mapTypeControl]="true"
        [zoom]="zoom" 
        [disableDefaultUI]="true" 
        class="map"
    >
        <agm-marker 
            *ngFor="let marker of markers" 
            [latitude]="marker.position.lat()" 
            [longitude]="marker.position.lng()"
        >
            <agm-info-window [disableAutoPan]="true">
                <div class="marker-text-container">
                    <ng-container *ngFor="let item of marker.text; let i = index;">
                        {{ marker.title[0] }}
                        <br />
                        <span class="small">{{ item }}</span>
                        <hr *ngIf="i < marker.text.length - 1" class="marker-separator"/>
                    </ng-container>
                </div>
            </agm-info-window>
        </agm-marker>
    </agm-map>
</dx-popup>

And this is the mapTypeControlOptions in the Angular part.

public mapTypeControlOptions: MapTypeControlOptions = {
        position: ControlPosition.LEFT_BOTTOM,
        style: 2,
        mapTypeIds: ['roadmap', 'satellite', 'hybrid', 'terrain'],
    };

But this is the Layers view that I'm getting

Layers View

Any help is appreciated, thanks in advance to all of you!

ddxkalin
  • 71
  • 9

0 Answers0