google-maps 相关问题

Google地图是Google提供的桌面和移动网络地图服务应用程序和技术,提供卫星图像,街道地图和街景视图。还支持通过Google Maps API嵌入第三方网站的地图,以及世界各地许多国家的城市企业和其他组织的定位器。

模拟来自 Google Places API 的 place_changed 事件

我已将位置自动完成功能添加到我的 React 项目的输入中。 const onPlaceChange = () => { 让地址 = autoCompleteService.current.getPlace(); onAddressChange(地址);...

回答 1 投票 0

在 Jest 中手动模拟 Google 地图

我想模拟我与 @googlemaps/js-api-loader 包一起使用的谷歌地图 API。 现在,我需要确保调用了地理编码器,并且我正在尝试通过以下方式执行此操作: 常量模拟Geocoder =

回答 2 投票 0

google_maps_flutter 在 ios 设备上崩溃,并出现错误“-[__NSCFString objectForKey:]:无法识别的选择器发送到实例 0x2808f4380”

我正在运行 google_maps_flutter 2.1.0 和 flutter 2.10.3。打开地图时,应用程序崩溃并显示以下错误日志。谁能指出问题到底出在哪里。 佩尔米...

回答 4 投票 0

Google 地图,是否可以使用材质图标作为地图标记?

是否可以使用 Flutter 中的材质图标作为带有 GoogleMap 小部件的 Flutter 应用程序中的标记?

回答 2 投票 0

Android 中有用于 Google 地图导航的 API 吗?

我正在开发一个 Android 应用程序,其中使用 Google 地图。它运作良好且良好。但 当用户点击“获取路线”加载地图后,Google 地图会显示路线...

回答 6 投票 0

Flutter google map 如何在 GoogleMap 的小部件 onCreated 函数之外实例化 GoogleMapController 进行测试?

我正在使用插件google_maps_flutter 1.2.0,我想实例化一个GoogleMapController来测试一些块的事件,其中控制器的值不能为空。 不幸的是,我不知道如何...

回答 5 投票 0

谷歌地图与当地教堂,如何构建API调用?

有没有办法使用 API 从 Google 检索地图,以便显示带有标记的当地教堂列表? 我有基本的语法,并且有基本的 API 帐户设置,...

回答 1 投票 0

如何在颤动中的谷歌地图折线上添加方向箭头

示例图片 我有一个颤振应用程序,可以在谷歌地图上绘制折线,指示用户的路径。我想使用类似于

回答 1 投票 0

Android 与谷歌地图位置和 URL Shortener API 共享意图

我正在尝试分享一个纬度和经度为的位置; 字符串 uri = "http://maps.google.com/maps?daddr=" + latLngMaps.latitude + "," + latLngMaps.longitude; 使用这些代码行: 我...

回答 1 投票 0

React-native 地理定位 api,标题始终为零。无法显示实时准确的运动(android)

令人震惊的是,react-native-geolocation 包无法显示 Android 设备的实时航向,尽管纬度和经度会实时更新并且设备会移动。我克制住……

回答 1 投票 0

Google 地图仍需要 READ_GSERVICES 权限吗?

要将 Google 地图添加到您的 Android 应用程序中,您需要包含一些权限: <...

回答 3 投票 0

谷歌地图不显示在手机上

大家好,我正在使用meteor-google-map。我可以在桌面上看到它们,但在移动设备上看不到它们。谁能告诉我我做错了什么?在移动设备上,地图容器都是...

回答 2 投票 0

Haversine 公式与 php

我想在php中使用这个公式。我有一个数据库,其中保存了一些纬度和经度值。 我想找到输入的特定纬度和经度值的所有距离...

回答 6 投票 0

摩洛哥谷歌地图

我想在针对摩洛哥人的网络应用程序中使用谷歌地图,问题是地图工作正常,但摩洛哥的边界不完整。这是一个政治问题,恐怕是

回答 2 投票 0

行程改变时如何清除折线?

我正在加载一个已加载地图和路线的页面。 我们可以通过此表格更改出发地、目的地和运输方式: ... 我正在加载一个已加载地图和路线的页面。 我们可以通过此表格更改出发地、目的地和运输方式: <div id="formulaire" class="box"> <input id="start" type="text" value="$4DTEXT($vo_personne.origine)" class="input my-1"> <input id="end" type="text" value="$4DTEXT($vo_personne.destination)" class="input my-1"> <div class="select my-1"> <select id="mode_transport"> <option value="DRIVING">Voiture</option> <option value="TRANSIT">Transports</option> </select> </div> <input type="submit" value="Actualiser le trajet" class="button my-1"> </div> 当我更改表单中的某些内容时,地图会发生变化,路线也会发生变化,但我没有找到清除上一张地图上的旧路线(折线)的方法。 这是我的JS代码 <script> // onglets jquery UI $( function() { $( "#tabs" ).tabs(); } ); // Google Maps function initMap() { directionsRenderer = new google.maps.DirectionsRenderer({ polylineOptions : { // works only on the active path strokeColor: '#0047b3', strokeOpacity: 1.0, strokeWeight: 7 } }); directionsService = new google.maps.DirectionsService(); map = new google.maps.Map(document.getElementById("carte"), { zoom: 5, center: { lat : 46.603354, lng: 1.888334}, // france }); directionsRenderer.setMap(map); calculateAndDisplayRoute(directionsService, directionsRenderer); document.getElementById("mode_transport").addEventListener("change", () => { calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("start").addEventListener("change", () => { calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("end").addEventListener("change", () => { calculateAndDisplayRoute(directionsService, directionsRenderer); }); } function calculateAndDisplayRoute(directionsService, directionsRenderer) { start = document.getElementById("start").value; end = document.getElementById("end").value; selectedMode = document.getElementById("mode_transport").value; directionsRenderer.setMap(map); directionsRenderer.setPanel(document.getElementById("itineraire")); directionsRequest = { origin: start, destination: end, travelMode: google.maps.TravelMode[selectedMode], provideRouteAlternatives: true, optimizeWaypoints: true, }; directionsService .route(directionsRequest) .then((response) => { directionsRenderer.setDirections(response); // console.log (response); // console.log (response.routes.length + ' routes'); // status = (response.status); if (status === 'OK') { // les routes trouvées for (var i = 0, len = response.routes.length; i < len; i++) { new google.maps.DirectionsRenderer({ map: map, directions: response, routeIndex: i }); // route sélectionnée par défaut ? // lui attribuer un ID ? var polyline = response.routes[i] ; } console.log (polyline); } }) .catch((e) => window.alert("Directions request failed due to " + e)); } // création de la carte à l'ouverture de la page window.initMap = initMap; </script> 我是初学者,这是我的第一张地图,所以我没有找到更新折线的解决方案。 新的很好,但最旧的应该删除或隐藏。 我尝试通过添加 polyline.remove() 来更改事件侦听器,但它会产生此错误: 未捕获(承诺中)ReferenceError:polyLinePath 未定义 document.getElementById("mode_transport").addEventListener("change", () => { polyline.remove(); calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("start").addEventListener("change", () => { polyline.remove(); calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("end").addEventListener("change", () => { polyline.remove(); calculateAndDisplayRoute(directionsService, directionsRenderer); }); 感谢您的帮助 您需要保留对用于显示路线的 DirectionRenderer 对象的引用。 全球范围内: let renderer = []; 然后,当您创建渲染器时,将它们推送到该数组上: for (var i = 0, len = response.routes.length; i < len; i++) { renderer.push(new google.maps.DirectionsRenderer({ map: map, directions: response, routeIndex: i })); } 然后要从地图中删除路线,请将这些渲染器上的地图设置为 null: function removeOldRoutes() { for (var i=0; i < renderer.length; i++) { renderer[i].setMap(null); } renderer = []; } 概念证明小提琴 代码片段 let map; let renderer = []; // Google Maps function initMap() { directionsRenderer = new google.maps.DirectionsRenderer({ polylineOptions : { // works only on the active path strokeColor: '#0047b3', strokeOpacity: 1.0, strokeWeight: 7 } }); directionsService = new google.maps.DirectionsService(); map = new google.maps.Map(document.getElementById("carte"), { zoom: 5, center: { lat : 46.603354, lng: 1.888334}, // france }); directionsRenderer.setMap(map); calculateAndDisplayRoute(directionsService, directionsRenderer); document.getElementById("mode_transport").addEventListener("change", () => { removeOldRoutes() calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("start").addEventListener("change", () => { removeOldRoutes() calculateAndDisplayRoute(directionsService, directionsRenderer); }); document.getElementById("end").addEventListener("change", () => { removeOldRoutes() calculateAndDisplayRoute(directionsService, directionsRenderer); }); } function removeOldRoutes() { for (var i=0; i < renderer.length; i++) { renderer[i].setMap(null); } renderer = []; } function calculateAndDisplayRoute(directionsService, directionsRenderer) { start = document.getElementById("start").value; end = document.getElementById("end").value; selectedMode = document.getElementById("mode_transport").value; directionsRenderer.setMap(map); directionsRenderer.setPanel(document.getElementById("itineraire")); directionsRequest = { origin: start, destination: end, travelMode: google.maps.TravelMode[selectedMode], provideRouteAlternatives: true, optimizeWaypoints: true, }; directionsService .route(directionsRequest) .then((response) => { directionsRenderer.setDirections(response); console.log (response); console.log (response.routes.length + ' routes'); status = (response.status); if (status === 'OK') { // les routes trouvées for (var i = 0, len = response.routes.length; i < len; i++) { console.log("rendering route "+i); renderer.push(new google.maps.DirectionsRenderer({ map: map, directions: response, routeIndex: i })); } } }) .catch((e) => window.alert("Directions request failed due to " + e)); } // création de la carte à l'ouverture de la page window.initMap = initMap; /* * Always set the map height explicitly to define the size of the div element * that contains the map. */ #carte { height: 80%; } /* * Optional: Makes the sample page fill the window. */ html, body { height: 100%; margin: 0; padding: 0; } <!doctype html> <html> <head> <title>StackSnippet</title> </head> <body> <div id="carte"></div> <div id="formulaire" class="box"> <input id="start" type="text" value="Paris" class="input my-1"> <input id="end" type="text" value="Marseille" class="input my-1"> <div class="select my-1"> <select id="mode_transport"> <option value="DRIVING">Voiture</option> <option value="TRANSIT">Transports</option> </select> </div> <input type="submit" value="Actualiser le trajet" class="button my-1"> </div> <!-- The `defer` attribute causes the script to execute after the full HTML document has been parsed. For non-blocking uses, avoiding race conditions, and consistent behavior across browsers, consider loading using Promises. See https://developers.google.com/maps/documentation/javascript/load-maps-js-api for more information. --> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap&v=weekly" defer ></script> </body> </html>

回答 1 投票 0

iOS 上的 Google 地图的性能问题

我正在使用 Google 地图作为应用程序,当我用手指在地图上移动时,我观察到地图有一些非常小的滞后,这是非常微妙的。 当我与 Google 地图应用程序或 MapKit 进行比较时,差异...

回答 2 投票 0

如何更改@angular/google-maps库中的地图标记颜色

我目前正在使用 @angular/google-maps 库开发 Angular 应用程序,我需要更改地图标记的颜色。 以下是相关详情: 角度版本:14.3.0 @an...

回答 1 投票 0

学说2中纬度和经度的数据类型

我需要在谷歌地图中显示位置。 我使用的是Symfony2、doctrine和MySQL。 需要帮助了解 yml/doctrine 中的正确类型。 预先感谢。

回答 3 投票 0

离子电容器谷歌地图setMapType不起作用

我正在使用 @capacitor/google-maps 插件中的 GoogleMap。我正在尝试将地图类型从普通更改为卫星。但这是行不通的。 等待 this.map.setMapType(MapType.Satellite);

回答 3 投票 0

移动地图与搜索位置

我最近正在集成 Google 地图和地点 api,一切正常,但我遇到了这个问题,当我搜索该地点时,建议会随之而来,但当我选择任何 o...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.