Angular-google-maps: 如何调整图标大小?

创建于 2016-07-18  ·  19评论  ·  资料来源: SebastianM/angular-google-maps

问题描述
我想将图标大小调整为某个预定义的大小。 我该怎么做?

重现步骤和问题的最小演示
当前行为
不存在缩放大小的选项。

预期/期望行为
我希望能够调整图标的大小。

angular2 和 angular2-google-maps 版本
最新的

其他信息

AgmMarker stale feature-request

最有用的评论

我可以针对标记的 iconUrl 属性使用Icon对象。

我的图标看起来像:

{
      url: require('../images/vehicle-active.png'), // gives a data://<value>
      scaledSize: {
        height: 40,
        width: 40
      }
}

然后我将它绑定到[iconUrl] 。 'iconUrl' 变量可能命名不当,但如果您查看源代码,它只会传递给 gmap 的 'icon' 属性。

所有19条评论

我正在尝试做同样的事情,但查看来源,没有办法做到这一点,分配图标的唯一方法是通过 url,您不能使用 google.maps.Icon 对象。 我正在考虑修改代码并为其创建拉取请求。

@SebastianM我写了一些代码来处理 google.maps.Symbol 和 google.maps.Icon 作为标记的图标属性,我明天会推送到我的叉子上,这样你就可以看一看

我同意我们应该同时支持 string 和 Icon 对象并将属性重命名为 icon
icon?: string|Icon;

我打破了 4 个单元测试,但我的叉子中有图标更新。 我还添加到 google-maps-types.ts 文件。

@cdarken我刚看到你的公关,会

@rc3media我试图让它向后兼容,这就是为什么我在标记上添加了“图标”访问器

什么时候加入这个功能? 这个问题来自八月 X_X

我可以针对标记的 iconUrl 属性使用Icon对象。

我的图标看起来像:

{
      url: require('../images/vehicle-active.png'), // gives a data://<value>
      scaledSize: {
        height: 40,
        width: 40
      }
}

然后我将它绑定到[iconUrl] 。 'iconUrl' 变量可能命名不当,但如果您查看源代码,它只会传递给 gmap 的 'icon' 属性。

@bradseefeld你在哪里放置定义图标的代码:在你的打字稿组件中? 我收到错误无法找到名称 'require'

我们正在使用 webpack 来处理和打包我们的应用程序。 它处理 require 调用。 我不认为这个解决方案会起作用,除非你使用 webpack 或类似的东西。

是的,我使用 webpack。 它有效,但我必须添加:
declare function require(path: string);

Require 不是必需的(至少对于 Ionic)

{
      url: 'assets/img/marker-me.png',
      scaledSize: {
        height: 40,
        width: 40
      }
}

@sebrojas14这在最新的 1.0.0.x 版本中不再起作用。
现在真的需要“字符串”,如果没有提供它会抛出错误。

你有什么想法什么时候可以使用这个非常需要的功能?

谢谢

@pdanysz对我来说很好用,版本 1.0.0-beta.3

@grereeenn我已经安装了那个版本,它给我一个错误,我就是这么问的:)

你能分享你的代码吗,...也许我做错了什么:)

谢谢

@pdanysz我们丢失了魔杖,从这里看不到您的错误。 如果您可以分享错误,那真的很有帮助,这样我们就知道您实际处理的是什么。 此外,我们需要您的代码才能知道如何修复错误。 换句话说,为了帮助您,我们需要一个完整的复制品,以便我们可以检查问题。 你能给我们吗?

我尝试使用这个对象:

icon = {
        url: '/assets/images/img.png', 
        scaledSize: {
          height: 40,
          width: 20
        }
      };

这对我有用。
但是,标记应该用于我地图上的多个场所,并且我不能在我的 ts 类中使用单个属性来使这项工作按预期进行。 因此,我没有在我的 html 上使用 [iconUrl]="icon",而是尝试使用 [iconUrl]="getIcon(buildingment)",它会为每个机构返回具有不同 url 的上述对象。 这会使应用在尝试加载 agm-map 时冻结。 我在这里写的东西足以说明这是否可行吗? 如果需要,我可以发送更多详细信息。
谢谢!

StackOverflow上找到了hrdkisback 的这条评论,它允许您动态更改地图标记图标并指定大小:

[iconUrl]='{"url": marker,"scaledSize": {"height": 10, "width": 10}}'

https://stackoverflow.com/questions/50812678/add-user-image-to-agm-marker-in-angular-5#comment88677807_50812678

此问题已自动标记为陈旧,因为它最近没有活动。 如果没有进一步的活动发生,它将被关闭。 感谢你的贡献。

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

n1t3w0lf picture n1t3w0lf  ·  3评论

maneesht picture maneesht  ·  3评论

Halynsky picture Halynsky  ·  3评论

ChrisDevinePimss picture ChrisDevinePimss  ·  3评论

stot3 picture stot3  ·  3评论