如何设置 agm-marker 标签的样式

Question

如何设置样式 agm-marker-label - max-width 以将文本设置为居中？我可以更改标签位置，但不能为集中标签名称设置最小宽度。

<agm-marker *ngIf="school.lat && school.lng" 
                    [iconUrl]="{url: school.mapMarker, scaledSize: {height: 75,width: 48},labelOrigin:{x:70,y:20}}"
                    [label]="{text:school.schoolName}"
                    [longitude]="school.lng | parseFloat"
                    [latitude]="school.lat | parseFloat">
        </agm-marker>

Answer 1

使用 2 [label] 属性对我不起作用。相反，以下工作：

<agm-marker
        *ngFor="let sp of mySPlist"
        [latitude]="sp.geoLat" [longitude]="sp.geoLon"
        [iconUrl]="sp.icon"
        [label]="{color: 'white', text: sp.name}"
      >
</agm-marker>

Answer 2

如果这对任何人有帮助...这是我发现的唯一有效的...放入[label]="labelOptions"您的标记，然后在 ts 文件中定义 css，如下所示...

labelOptions = {
    color: 'white',
    fontFamily: '',
    fontSize: '14px',
    fontWeight: 'bold',
    text: "some text"
}


<agm-marker  *ngFor="let data of serviceProvider; let i = index" [latitude]="data.Geolocation__c.latitude" [longitude]="data.Geolocation__c.longitude" [label]="labelOptions" [label]="{i+1}"> 
    <agm-snazzy-info-window [maxWidth]="200" [closeWhenOthersOpen]="true">
        <ng-template>
            {{ i+1}}
        </ng-template>
    </agm-snazzy-info-window>
</agm-marker>
</agm-map><br/>