使用ammm标记管理图标的大小

Question

我正在尝试将高度和宽度的css应用于图标。

我用于带有agm-marker的图标的代码如下：-

<agm-marker *ngFor="let m of mapData; let i = index"
    [latitude]="m.lat"
    [longitude]="m.lng"
    [label]="labelOptions"
    [iconUrl]="iconUrl">
</agm-marker>

。ts

public iconUrl = 'http://developerdrive.developerdrive.netdna-cdn.com/wp-content/uploads/2013/08/ddrive.png';

[请让我知道如何处理此图标的大小。这是我添加的自定义图标

Answer 1

您可以将Icon对象作为参数传递给IconURL。 Icon具有可以修改的scaledSize参数。这可能是一个示例：

    icon = {
              url: 'http://developerdrive.developerdrive.netdna-cdn.com/wp-content/uploads/2013/08/ddrive.png',
              scaledSize: {
                width: desiredWidthScale,
                height: desiredHeightScale
              }
}

所以您可以使用：

<agm-marker *ngFor="let m of mapData; let i = index"
    [latitude]="m.lat"
    [longitude]="m.lng"
    [label]="labelOptions"
    [iconUrl]="icon">
</agm-marker>

考虑到您正在修改图像的比例而不是实际尺寸。

Answer 2

手动调整涂料中图像/图标的大小，并保持30或40像素。这将解决问题。

Answer 3

尝试一下

  icon = { url: '../../assets/images/yyy.svg', scaledSize: {height: 40, width: 40}