地图不显示googlemaps js API

时间:2016-02-15 18:13:29

标签: javascript google-maps google-maps-api-3 geocoding

我试着使用示例代码来拥有一个网页,以便在地图上显示多个图钉。

这是我的HTML代码:

((imgSomeFile).Source as BitmapImage).UriSource.OriginalString

诀窍是使用带参数的url来添加要显示的位置:

Ex:http://myserver.com?q=MyFirstPoint@59.591,17.82

实际上没有显示任何内容..

有人可以帮我吗?我的API密钥在代码上;)

非常感谢,

致以最诚挚的问候,

的Fab'

2 个答案:

答案 0 :(得分:2)

你有一个

 callback=initMap  

但我看不到这个名字的功能

和你有类似的

<body onunload="GUnload()">

但我看不到这个名字的功能

你必须小心谨慎,你可以调用正确的init函数来显示地图,并在浏览器控制台中查看其他错误

答案 1 :(得分:-3)

  

Q = MyFirstPoint @ 59.591,17.82&安培; Q = MyLastPoint @ 54.591,12.82

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div id="map" style="width: 550px; height: 450px"></div>


<script>
    (function (myGoogleMap) {
        var map;
        var latLngBounds;

        myGoogleMap.init = function () {
            console.log('init');
            latLngBounds = new google.maps.LatLngBounds();
            map = new google.maps.Map(document.getElementById('map'), {
                center: {
                    lat: -34.397,
                    lng: 150.644
                },
                zoom: 8,
                mapTypeId: google.maps.MapTypeId.TERRAIN,
                panControl: false,
                zoomControl: true,
                mapTypeControl: true,
                scaleControl: false,
                streetViewControl: false,
                overviewMapControl: false
            });
            getData();
        };

        function getData() {


            var query = location.search.substring(1);

            // split the rest at each "&" character to give a list of  "argname=value"  pairs
            var pairs = query.split("&");

            for (var i = 0, l = pairs.length; i < l; i++) {
                // break each pair at the first "=" to obtain the argname and value
                var pos = pairs[i].indexOf("=");
                var argname = pairs[i].substring(0, pos).toLowerCase();
                var value = pairs[i].substring(pos + 1);

                // process each possible argname  -  use unescape() if theres any chance of spaces
                if (argname == "q") {
                    var text = decodeURI(value);
                    var parts = text.split("@");
                    var latlng = parts[1].split(",");
                    setMarker(parseFloat(latlng[0]), parseFloat(latlng[1]), parts[0]);
                }
            }
            centerMap();
        }

        function setMarker(lat, lng, contentString) {
            var latLng = new google.maps.LatLng(lat, lng);
            latLngBounds.extend(latLng);
            var marker = new google.maps.Marker({
                position: latLng,
                map: map
            });
            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });
            marker.addListener('click', function () {
                infowindow.open(map, marker);
            });
        }

        function centerMap() {
            map.fitBounds(latLngBounds);
        }

    }(window.myGoogleMap = {}))
</script>

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAs4c8xnkxcZNRK6yQt-Y21N1L3mT1AFfE&callback=myGoogleMap.init"></script>

<noscript><b>JavaScript must be enabled in order for you to use Google Maps.</b>
    However, it seems JavaScript is either disabled or not supported by your browser.
    To view Google Maps, enable JavaScript by changing your browser options, and then
    try again.
</noscript>
</body>
</html>

我希望这可以提供帮助。