问题描述
我有一个页面加载谷歌地图。我通过http使用getCurrentPosition，甚至我收到来自google api的警告。问题是，它也打破了JavaScript，并破坏了一切。代码工作了很长一段时间，但最后一周事情破裂了。
下面是html和脚本。您可以将它添加到html中并运行它并查看（使用stackoverflow进行尝试，但对脚本有一些问题）
getCurrentLocation仅支持 https：// 现在在Chrome上。
在Chrome中的JavaScript控制台中已经有一段时间了，刚刚宣布。
I have a page where I am loading google maps. I use getCurrentPosition over http and even I receive a warning from google api. The problem is that it breaks also the javascript and that ruins everything. The code was working for quite some time but the last week things broke.
Below is the html and script. You can add it in html and run it and see (tried with stackoverflow but had some issues with the script)
<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> </head> <body> <header class="desktop"> </header> <div id="st-container" class="st-container"> <div class="st-pusher"> <div class="st-content"> <div class="st-content-inner"> <div class="logo-mobile"> </div> <section class="map-sections"> <div style="position: absolute; z-index: 1000; width: 100%; margin-top: 30px;"> <div class="row"> <div class="large-12 columns"> <div class="filter clearfix"> <input type="text" id="search-field" placeholder="Search place"> <span>eller...</span> <a href="#" id="search-button" class="btn pink geolocate" onclick="showMap('true');">Search near you</a> </div> </div> </div> </div> <div id="google_canvas"></div> <script src="http://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script> <script type="text/javascript"> function showMap(userPos) { if (!!navigator.geolocation) { var map; if (userPos == 'true') { var mapOptions = { zoom: 12, enableHighAccuracy: true, mapTypeControl: false, streetViewControl: false, mapTypeId: google.maps.MapTypeId.ROADMAP }; } else { var mapOptions = { zoom: 5, enableHighAccuracy: false, mapTypeControl: false, streetViewControl: false, mapTypeId: google.maps.MapTypeId.ROADMAP }; } map = new google.maps.Map(document.getElementById('google_canvas'), mapOptions); navigator.geolocation.getCurrentPosition(function (position) { var geolocate = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); var sectionList = [ ['Stockholm', 59.327, 18.067], ['Göteborg', 57.70889, 11.97348] ]; var mapPinUser = '/dist/img/map-pin-user.png'; var mapPinSection = '/dist/img/map-pin-section.png'; // User's position var marker = new google.maps.Marker({ position: geolocate, map: map, icon: mapPinUser, title: "ok" }); for (var i = 0; i < sectionList.length; i++) { marker = new google.maps.Marker({ position: new google.maps.LatLng(sectionList[i][1], sectionList[i][2]), map: map, icon: mapPinSection, id: i, animation: google.maps.Animation.DROP, title: sectionList[i][0] }); } if (userPos == 'true') { map.panTo(geolocate); } else { map.setCenter({ lat: 61.58549, lng: 15.02930 }); } }); } else { document.getElementById('google_canvas').innerHTML = 'No Geolocation Support.'; } } showMap('false'); </script> <style> #google_canvas { height: 65vh; } </style> </section> </div> </div> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> </body> </html>解决方案getCurrentLocation is only supported over https:// now on Chrome.
There has been a warning in place in the javascript console in Chrome for quite a while, and it was announced a while ago.
这篇关于Chrome上的getCurrentPosition会中断JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！