Question

我使用Google Maps API编写了一个小脚本，它可以与Chrome或IE完美搭配。但是，当我尝试使用Excel的Webbrowser控件来运行映射时，它会显示一条错误消息，并且页面无法正确加载。

我不确定那里发生了什么。我怀疑我的JavaScript / HTML代码有问题，因为我之前根本没有这两种语言的经验。提供的错误消息是：

此页面上的脚本发生错误。行：0，字符：0，错误：脚本错误，代码：0，网址：https://maps.gstatic.com/maps-api-v3/api/js/21/7/intl/en_au/main.js“

我的想法是HTML部分有问题，但我不确定。

我的代码是

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Circle & Info</title>
    <style>
        html, body, #map-canvas {
            height: 100%;
            margin: 0px;
            padding: 0px
        }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;signed_in=true"></script>
    <script>
        var locations = [
        ['St. Martin Catholic School', ' 4228', 42.9698, -81.2537, ' 266', ' 386', 'FE7569', '-1', ''],
        ['St. John Catholic French Immersion School', ' 4045', 42.97827, -81.2335, ' 350', ' 334', 'FE7569', '-1', ''],
        ['St. Mary Choir Catholic School', ' 4244', 42.988, -81.2284, ' 231', ' 311', 'FE7569', '-1', ''],
        ['Holy Rosary Catholic School', ' 3312', 42.9663, -81.2302, ' 165', ' 234', 'FE7569', '-1', ''],
        ['St. Michael Catholic School, London', ' 4301', 43.0042, -81.2446, ' 182', ' 268', 'FE7569', '-1', ''],
        ['New School', ' 99999',42.9809401, -81.2548567, ' ', ' 100', '9', '0', 'Not']
        ];
 var markers = [];
 var map;
 var circles = [];
 var radius;
 function initialize() {
     radius = document.getElementById("radius_value").value;
     if (radius == "" || isNaN(radius)) {
         radius = 2;
     }
     radius = Number(radius * 1000);
     var myOptions = {
         center: new google.maps.LatLng(42.9809401, -81.2548567),
         zoom: 8,
         mapTypeId: google.maps.MapTypeId.ROADMAP
     };
     map = new google.maps.Map(document.getElementById("default"), myOptions);
     setMarkers(radius);
 }
 var bounds = new google.maps.LatLngBounds();
 function setMarkers(radius) {
     var i;
     for (i = 0; i != markers.length; ++i) {
         markers[i].setMap(null);
     }
     for (i = 0; i < locations.length; i++) {
            var name = locations[i][0];
            var sfis = locations[i][1];
            var lat = locations[i][2];
            var long = locations[i][3];
            var ade = locations[i][4];
            var otg = locations[i][5];
            var pinColor = locations[i][6];
            var Indicator = locations[i][7];
            var Duplicate = locations[i][8];
            var latlngset = new google.maps.LatLng(lat, long);
            var pinImage;
            if (Indicator==0){
            pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_xpin_letter&chld=pin|N|"+pinColor,
                new google.maps.Size(21, 34),
                new google.maps.Point(0, 0),
                new google.maps.Point(10, 34));
            } else if (Indicator==-1) {
                if (Duplicate=="Duplicate") {
            pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_xpin_letter&chld=pin_sleft|"+(i+1)+"|"+pinColor,
                new google.maps.Size(50, 34),
                new google.maps.Point(0, 0),
                new google.maps.Point(20, 34));
                } else {
            pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_xpin_letter&chld=pin|"+(i+1)+"|"+pinColor,
                new google.maps.Size(50, 34),
                new google.maps.Point(0, 0),
                new google.maps.Point(10, 34));
                }
            } else {
                if (Duplicate =="Duplicate") {
            pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_xpin_letter&chld=pin_sright|"+Indicator+"|"+pinColor,
                new google.maps.Size(50, 50),
                new google.maps.Point(0, 0),
                new google.maps.Point(0, 34));
                } else {
            pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_xpin_letter&chld=pin|"+Indicator+"|"+pinColor,
                new google.maps.Size(50, 50),
                new google.maps.Point(0, 0),
                new google.maps.Point(10, 34));}
            }
            var marker = new google.maps.Marker({
                map: map,
                title: name,
                draggable:true,
                position: latlngset,
                icon: pinImage,
                animation: google.maps.Animation.DROP
            });
            markers.push(marker);
            map.setCenter (marker.getPosition())
            var populationOptions = {
                strokeColor: '#FF0000',
                strokeOpacity: 0.2,
                strokeWeight: 2,
                fillColor: '#FF0000',
                fillOpacity: 0.1,
                map: map,
                center: latlngset,
                radius: radius
            };
            var content = '<div id="content">' +
                '<h1 id="firstHeading" class="firstHeading">' + name +'</h1>' +
                '<div id="bodyContent">' +
                '<p><b>SFIS ID:</b>' + sfis + '</p>' +
                '<p><b>ADE:</b>' + ade + '</p>' +
                '<p><b>OTG:</b>' + otg + '</p>' +
                '</div>' +
                '</div>';
            var infowindow = new google.maps.InfoWindow()
            google.maps.event.addListener(marker, 'click', (function(marker, content, infowindow) {
                return function() {
                    infowindow.setContent(content);
                    infowindow.open(map, marker);
                };
            })(marker, content, infowindow));
            new google.maps.Circle(populationOptions);
            bounds.extend(markers[i].position);
            map.fitBounds(bounds);
        }
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body onload="initialize()">
    <div style="position:fixed;top:10px;right:200px;z-index:2000">
        <input type="text" id="radius_value">
        <button onclick="initialize()">Change Radius (km)</button>
    </div>
    <div id="default" style="width:100%; height:100%"></div>
</body>
</html>

Answer 1

我认为您的HTML代码看起来很好，并且您的Excel代码可能是问题所在我已将您的文件上传到我的服务器上在webcontrol中尝试以下代码

WebBrowser1.Navigate ("about:blank")
WebBrowser1.Navigate ("www.rachelgallen.com/googlemap.html")

OR

在页面上放置一个cmd按钮。在网络控件上方的单元格中键入网址。在cmd按钮的代码中，声明一个变量，例如linkname并将其设置为Range（单元格）。然后，键入（例如，Sheet1是工作表的名称，C1是您键入URL的位置）

linkname=Sheets("Sheet1").Range(C1)
Call Sheets("Sheet1").WebControl1.Navigate (linkname)

并查看是否有效

谷歌地图代码可以在Excel的Webbrowser控件中运行吗？

1 个答案: