问题标签 [agm-core]

我正在使用 agm-direction 包在 agm-map ( https://www.npmjs.com/package/agm-direction ) 上显示路线信息。

我想知道如何渲染信息窗口的内容，尤其是原始标记：

输出如下所示：

我想做这样的事情，所以我可以构建一个更复杂的信息窗口：

我正在使用 agm-core 组件在我的应用程序中使用 Google 地图。地图显示正常。在我的 app.module.ts 中，我有以下内容：

在我的 html 中，我有：

我的 ts 文件是：

搜索栏根本不会弹出位置。没有错误被抛出。也许问题来自带有角度 8 的 @ViewChild 的新版本。使用 Ionic 4 访问 DOM 也可能不同？

有什么想法可以帮助我吗？

亲切的问候

我正在使用agm/core在角度组件中自动完成谷歌地址，并在我的服务模块中添加了以下代码。

在我的组件初始化时，我添加了以下代码，

但是当我第二次输入地址并选择它时加载该组件后选择第一次地址时它不起作用。任何想法？

当我在 agm-map 上使用函数 (boundsChange) 时，我正在使用来自 google @agm-core 的 Angular Maps 和 agm-overlay 的自定义标记，我收到错误 invalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat:不是数字

使用普通的 agm 标记我没有任何错误，但我需要使用自定义标记来显示它的信息

我用'almacenes'的边界和获取和数组对我的数据库进行查询

我的功能

map.component.html

我收到错误 invalidValueError: setPosition: not a LatLng or LatLngLiteral: in property lat: not a number 并且 agm-info-window 不起作用

I'm trying to allow user to click on the marker pin to show the red circle for the specific pin.

Below is my map code:

我正在创建一个应用程序，其中一个地图作为标题（全局视图），另一个地图位于页面中间，代表一些详细视图。我在这个 StackBlitz 中得到了这个工作。

现在为了最大程度地减少代码重复，我想将标题映射移动到父组件，这样我就可以在多个页面中重用全局映射标题。我可以通过 Angular 路由器（children标签）来做到这一点。这意味着以下内容：

但不知何故，只有子组件中的地图加载。我在这个 StackBlitz中重现了这种行为。

现在我想知道，我在这里做错了吗？我似乎找不到任何为什么这段代码不应该工作的原因。

版本

• @agm/核心1.0.0
• 角8.2.10

我是角度的新手。我想在我的角度应用程序中添加谷歌地图。我正在使用 agm 模块。但我无法在其中添加 mapTypeControlOptions 字段。当我尝试在 HTML 中添加它时，页面停止加载，但没有显示错误。 <agm-map id='map' [latitude]=37.4275 [longitude]= -122.1697 [zoom]=16 [mapTypeId]="'roadmap'"[mapTypeControl]="false" [disableDefaultUI]="true" [zoomControl]="false" [streetViewControl]="false" fullscreenControl]="false" [gestureHandling]="greedy" [mapTypeControlOptions]={the options}></agm-map>

我们有一个使用 Angular 制作的简单应用程序，它有 5 个页面，每个页面都有 Google 地图。我们迁移到 Angular 的原因是，我们可以将每个用户会话的 Map 调用次数减少到只有 1 个（在基于 javascript 的应用程序中，每个会话最多 20 个！）。

然而，我们的实现仍然需要与访问这些页面的次数一样多的地图调用，我们想知道我们做错了什么。

这是我们的设置：

• 我们使用的是 agm-core 库（而不是直接使用 JS 脚本）我们将我们的应用程序分为 5 个子组件（每个页面都有自己的组件）和一个主组件：/home。地图在与 Home 组件同级的单独组件中导入

• 我们还允许用户隐藏地图。为此，我们尝试了两件事：1.) 将地图高度/宽度设置为零。2.) 将地图推出屏幕边界，并在用户想看时将其带回来。

我们的组件结构：

点击每个页面不应再次初始化map-div，但是，在测试并查看 GCP 中的 API 调用之后，我们意识到每次页面点击仍然计入 Map 调用。

注意：为了测试 API 调用的数量，我们使用新密钥创建了一个单独的环境，并执行了有限的、可追溯的步骤来识别正确的调用数量。对 Pages 1..5 的每次点击都算作一次单独的 API 调用。

以下是点击第 1...5 页后GCP API/Services -> Credentials -> Key上显示的用法 ，共 12 次。

我们还查看了 Billing 下的 Transactions，数字似乎是正确的（Dynamic Map 调用的费用）。

我们还没有仔细研究 agm-core 中的代码，并试图避免使用 Javascript 实现自定义类的开销，希望一定有更好的方法来做到这一点。如果我们可以包含更多信息/代码，请提出评论。

我们应该采取什么方法使每个会话只花费我们 1 次地图加载？

谢谢

是否有任何内置设置可以自动缩放到多边形？我发现标记有自动缩放功能，但它不适用于多边形。

JSFiddle

因为它在构建过程中显示错误。

app/pages/TestPage4/TestPage4.ts:27:27 中的错误 - 错误 TS2304：找不到名称“google”。

27 this.geoCoder = 新的 google.maps.Geocoder; ~~~~~~ app/pages/TestPage4/TestPage4.ts:29:32 - 错误 TS2304: 找不到名称 'google'。

29 常量自动完成 = 新 google.maps.places.Autocomplete(this.searchElementRef.nativeElement); ~~~~~~ app/pages/TestPage4/TestPage4.ts:33:24 - 错误 TS2503: 找不到命名空间 'google'。

33 常量位置：google.maps.places.PlaceResult = autocomplete.getPlace(); ~~~~~~

下面是我的代码。

正如我F12它new google.maps.Geocoder并向我展示它存在于下面。
但实际上在构建时会显示上述错误。

更新1：

这是tsconfig.json文件。

更新 2：
使用在 google.maps.places.PlaceResultdeclare var google: any;上有效
this.geoCoder = new google.maps.Geocoder;但
const autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement);在google.maps.places.PlaceResult上失败 找不到命名空间“google” const place: google.maps.places.PlaceResult = autocomplete.getPlace();