Google地图是Google提供的桌面和移动网络地图服务应用程序和技术,提供卫星图像,街道地图和街景视图。还支持通过Google Maps API嵌入第三方网站的地图,以及世界各地许多国家的城市企业和其他组织的定位器。
模拟来自 Google Places API 的 place_changed 事件
我已将位置自动完成功能添加到我的 React 项目的输入中。 const onPlaceChange = () => { 让地址 = autoCompleteService.current.getPlace(); onAddressChange(地址);...
我想模拟我与 @googlemaps/js-api-loader 包一起使用的谷歌地图 API。 现在,我需要确保调用了地理编码器,并且我正在尝试通过以下方式执行此操作: 常量模拟Geocoder =
google_maps_flutter 在 ios 设备上崩溃,并出现错误“-[__NSCFString objectForKey:]:无法识别的选择器发送到实例 0x2808f4380”
我正在运行 google_maps_flutter 2.1.0 和 flutter 2.10.3。打开地图时,应用程序崩溃并显示以下错误日志。谁能指出问题到底出在哪里。 佩尔米...
是否可以使用 Flutter 中的材质图标作为带有 GoogleMap 小部件的 Flutter 应用程序中的标记?
Android 中有用于 Google 地图导航的 API 吗?
我正在开发一个 Android 应用程序,其中使用 Google 地图。它运作良好且良好。但 当用户点击“获取路线”加载地图后,Google 地图会显示路线...
Flutter google map 如何在 GoogleMap 的小部件 onCreated 函数之外实例化 GoogleMapController 进行测试?
我正在使用插件google_maps_flutter 1.2.0,我想实例化一个GoogleMapController来测试一些块的事件,其中控制器的值不能为空。 不幸的是,我不知道如何...
有没有办法使用 API 从 Google 检索地图,以便显示带有标记的当地教堂列表? 我有基本的语法,并且有基本的 API 帐户设置,...
示例图片 我有一个颤振应用程序,可以在谷歌地图上绘制折线,指示用户的路径。我想使用类似于
Android 与谷歌地图位置和 URL Shortener API 共享意图
我正在尝试分享一个纬度和经度为的位置; 字符串 uri = "http://maps.google.com/maps?daddr=" + latLngMaps.latitude + "," + latLngMaps.longitude; 使用这些代码行: 我...
React-native 地理定位 api,标题始终为零。无法显示实时准确的运动(android)
令人震惊的是,react-native-geolocation 包无法显示 Android 设备的实时航向,尽管纬度和经度会实时更新并且设备会移动。我克制住……
Google 地图仍需要 READ_GSERVICES 权限吗?
要将 Google 地图添加到您的 Android 应用程序中,您需要包含一些权限: <...
大家好,我正在使用meteor-google-map。我可以在桌面上看到它们,但在移动设备上看不到它们。谁能告诉我我做错了什么?在移动设备上,地图容器都是...
我想在php中使用这个公式。我有一个数据库,其中保存了一些纬度和经度值。 我想找到输入的特定纬度和经度值的所有距离...
我想在针对摩洛哥人的网络应用程序中使用谷歌地图,问题是地图工作正常,但摩洛哥的边界不完整。这是一个政治问题,恐怕是
我正在加载一个已加载地图和路线的页面。 我们可以通过此表格更改出发地、目的地和运输方式: ... 我正在加载一个已加载地图和路线的页面。 我们可以通过此表格更改出发地、目的地和运输方式: <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>
我正在使用 Google 地图作为应用程序,当我用手指在地图上移动时,我观察到地图有一些非常小的滞后,这是非常微妙的。 当我与 Google 地图应用程序或 MapKit 进行比较时,差异...
如何更改@angular/google-maps库中的地图标记颜色
我目前正在使用 @angular/google-maps 库开发 Angular 应用程序,我需要更改地图标记的颜色。 以下是相关详情: 角度版本:14.3.0 @an...
我需要在谷歌地图中显示位置。 我使用的是Symfony2、doctrine和MySQL。 需要帮助了解 yml/doctrine 中的正确类型。 预先感谢。
我正在使用 @capacitor/google-maps 插件中的 GoogleMap。我正在尝试将地图类型从普通更改为卫星。但这是行不通的。 等待 this.map.setMapType(MapType.Satellite);
我最近正在集成 Google 地图和地点 api,一切正常,但我遇到了这个问题,当我搜索该地点时,建议会随之而来,但当我选择任何 o...