-1

我已经检查了整个互联网，并尝试了一些解决方案，但似乎无法找到如何组合您自己的位置并同时在地图上显示一些标记。

我得到了这个代码来显示多个标记，它工作得很好，但是我如何用谷歌地图来调用我自己的位置呢？我知道有关于如何添加您自己的位置但不结合这两个选项的文档。

关于重复的编辑：

在 stackoverflow 上没有这样的问题，因此没有重复，因为没有关于组合多个标记并显示您自己的位置标记的问题。

这是我现在得到的代码：

     <script>

        function initialize() {
            var map;
            var bounds = new google.maps.LatLngBounds();
            var mapOptions = {
                mapTypeId: 'roadmap'
            };




            map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
            map.setTilt(45);


            var markers = [
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567],
    ['some locations, city', 52.35475,19.532567]
            ];




            var infoWindowContent = [
                ['<div class="info_content">' +
                '<h3>London Eye</h3>' +
                '<p>The London Eye is a giant Ferris wheel situated on the banks of the River Thames. The entire structure is 135 metres (443 ft) tall and the wheel has a diameter of 120 metres (394 ft).</p>' +        '</div>'],
                ['<div class="info_content">' +
                '<h3>Palace of Westminster</h3>' +
                '<p>The Palace of Westminster is the meeting place of the House of Commons and the House of Lords, the two houses of the Parliament of the United Kingdom. Commonly known as the Houses of Parliament after its tenants.</p>' +
                '</div>']
            ];




            var infoWindow = new google.maps.InfoWindow(), marker, i;

           // Here we get our own location

    var showPosition = function (position) {
    var userLatLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
    var marker = new google.maps.Marker({
        position: userLatLng,
        title: 'Your Location',
        map: map
    });
}

    // Show all the markers and show my own location. Show my own location don't work.

    for( i = 0; i < markers.length; i++ ) {
        var position = new google.maps.LatLng(markers[i][1], markers[i][2], showPosition); 
        bounds.extend(position);
        marker = new google.maps.Marker({
            position: position,
            map: map,
            title: markers[i][0]
        });


                google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infoWindow.setContent(infoWindowContent[i][0]);
                        infoWindow.open(map, marker);
                    }
                })(marker, i));


                map.fitBounds(bounds);
            }


            var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
                this.setZoom(11);
                google.maps.event.removeListener(boundsListener);
            });

        }
        </script>
4

2 回答 2

1

在您的声明下方添加以下 JavaScript 代码var markers

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(callback) {
            showPosition(callback)
        }, function(error) {
            console.log(error)
        });
    }
}

function showPosition(position) {
    markers.push(['test', position.coords.latitude, position.coords.longitude])
}

getLocation();

我们正在获取用户位置，并将其推送到包含标记数据的初始数组数组中，请注意这在 http 上不起作用，因为 Google 通过禁用 getCurrentPosition() 来阻止使用它不安全的起源。本地主机应该可以工作，因为它被认为是“安全的”

于 2016-09-21T09:08:29.507 回答
1

通过使用 geocodezips 回答：谷歌使用地理定位按钮映射多个标记

没有标记，但设法通过 Roberrrt 之前提供的一些代码自己添加。这是 jsfiddle：https ://jsfiddle.net/k4kqg1gw/27/

['Helooo',40, 30 ,0] , ['Helooo',41.04564,28.97862 ,1], ['Your location',position.coords.latitude, position.coords.longitude] , ];
于 2016-09-21T11:13:25.607 回答