Question

我需要将我的谷歌地图javascript放入外部javascript文件中，我遇到了一些问题。下面的代码来自我的HTML文件，我尝试将函数复制到外部文件中，包括脚本src标签和DomListener。我遇到的问题是与DomListener，它无法正确加载其参数。我想知道你是否可以帮我解决我需要放在外部文件中的内容以及我需要在HTML文件中调用什么来执行我的脚本？

非常感谢，安东尼

<!DOCTYPE html>
<html>
<head>
<link href="mystyle.css" rel="stylesheet" type="text/css" />
<meta name="Park Map Brisbane"
    content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Info windows</title>
<style>
#map-canvas {
    height: 800px;
    width: 800px;
    text-align: center;
    margin-left: 51px;
    margin: 0px;
    padding: 0px
}

.gm-style-iw {
    height: 100% !important;
    overflow: hidden !important;
}
</style>
<script
    src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
    function initialize() {
        var myLatlng1 = new google.maps.LatLng(-25.363882, 150.044922);
        var myLatlng2 = new google.maps.LatLng(-25.363882, 152.044922);
        var mapOptions = {
            zoom : 6,
            center : myLatlng1
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'),
                mapOptions);

        var contentString1 = 'Mott Park'
        var contentString2 = 'Kilpa Park'

        var infowindow = new google.maps.InfoWindow({});

        var marker1 = new google.maps.Marker({
            position : myLatlng1,
            map : map,
            title : 'Park'
        });
        var marker2 = new google.maps.Marker({
            position : myLatlng2,
            map : map,
            title : 'Water'
        });
        google.maps.event.addListener(marker1, 'click', function initialize() {
            infowindow.close();//hide the infowindow
            infowindow.setContent(contentString1);//update the content for this marker
            infowindow.open(map, marker1);

        });
        google.maps.event.addListener(marker2, 'click', function initialize() {
            infowindow.close();//hide the infowindow
            infowindow.setContent(contentString2);//update the content for this marker
            infowindow.open(map, marker2);
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
    <div id="map-canvas"></div>
</body>
</html>

Answer 1

它对我来说很好。

这是我的观点/ HTML文件

<html>
<head>
    <link href="mystyle.css"  rel="stylesheet" type="text/css"/>
    <meta name="Park Map Brisbane" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Info windows</title>
        <style>
        #map-canvas {
        height: 800px;
        width: 800px;
        text-align: center;
        margin-left: 51px;
        margin: 0px;
        padding: 0px
        }
       .gm-style-iw{
       height: 100% !important;
       overflow: hidden !important;
       </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script src="/assets/scripts/test.js"></script>    
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
<html>

脚本部分放在名为test.js

的外部文件中

要访问我的javascript文件，我需要文件路径＆＃39; / assets / scripts＆＃39;。请输入脚本所在的文件路径。例如，如果它在同一文件夹级别，它将只是test.js。

将Google Maps Javascript功能放入外部文件

1 个答案: