Google 地图和 jQuery 错误消息 - 地理位置答案

【问题标题】：Google maps and jQuery error messages - geolocationGoogle 地图和 jQuery 错误消息 - 地理位置
【发布时间】：2014-09-23 08:12:03
【问题描述】：

我正在尝试在我的网站头部部分的简单谷歌地图上显示用户位置：

<head>
    <!--jquery ,js scripts  -->
    <link rel="stylesheet" href="styles.css" />
    <link rel="stylesheet"href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
    <!--js scripts -->
    <script src="jsCode.js"></script> 
    <script src ="sirJson.js"></script>
    <!--gMap plugin API -->

    <script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=AIzaSyAVVQuKtaYbe30ZdNueAcpcXXXIik_5Rjs"></script>
    <script src = "gmap.js"></script>    
</head>

还有地图div：

<div data-role="main" class="ui-content">
            <div id="map"></div>
        </div>

在我尝试过的js部分：

$('#mapButton').click (function () {

        var myMap = document.getElementById('map');
        var map = new google.maps.Map(myMap);
         var mapOptions = { 
            center: new google.maps.LatLng(43.552965, 43.47315),
            zoom: 10,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        })  ;

错误：

未捕获的类型错误：无法读取 null 的属性 'lat'

以及用户位置：

var myMap = document.getElementById('map');
        var map = new google.maps.Map(myMap);
         var mapOptions = { 
            center: new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
            zoom: 10,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        })  ;

错误

Uncaught ReferenceError: position is not defined and You denied permission to retrieve a position - 错误。

fiddle-http://jsfiddle.net/rma3jzgw/ ->修复一些东西->通过谷歌地图显示位置

【问题讨论】：

你能做个小提琴吗
它适用于 jQuery 吗？我以前试过，没有很好的结合。
我用过这个-developers.google.com/maps/tutorials/fundamentals/…，相同的代码。
这是你必须使用的。我没有得到你的问题。如果您创建一个代码 sn-p 或小提琴将会很有帮助。
小提琴 - jsfiddle.net/rma3jzgw

标签： javascript jquery html google-maps geolocation

【解决方案1】：

我只是简单地从 https://developers.google.com/maps/documentation/javascript/tutorial 它起作用了

<script src="https://maps.googleapis.com/maps/api/js"></script>
    <script>
           function initialize() {
            var map_canvas = document.getElementById('map_canvas');
            var map_options = {
                center: new google.maps.LatLng(16.470, 96.100),
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            var map = new google.maps.Map(map_canvas, map_options)
        }
        google.maps.event.addDomListener(window, 'load', initialize);
    </script>-->

【讨论】：

我试过了：未捕获的类型错误：无法读取属性 'lat' 并且仍然没有解决用户位置错误。