Cluster Image not Appearing (only number appearing) - agm-cluster-marker - Angular 5

Question

I wanted a cluster image to appear as a background to the cluster marker count but only the number is being displayed

Following is the code to get the above Output:

<agm-map 
                                    [latitude]="lat" 
                                    [longitude]="lng" 
                                    [fullscreenControl]='true'
                                    [zoom]="zoom"
                                    [disableDefaultUI]='false'
                                    [zoomControl]='false'
                                    [mapTypeControl]='true'
                                    (mapClick)="mapClicked($event)"
                                    [mapTypeId]="'terrain'"
                                    >
                                    <agm-marker-cluster imagePath="'cluster.png'">
                                        <agm-marker 
                                            *ngFor="let m of markers;let i = index"
                                            (markerClick)="clickedMarker(m, i)"
                                            [latitude]="m.lat" 
                                            [longitude]="m.lng"
                                            [markerDraggable]="m.draggable"
                                            [iconUrl]="icon">
                                        </agm-marker>
                                    </agm-marker-cluster>
</agm-map>

What am I missing here? Help me out. Thanks in advance.