javascript - 在我的 meteor 应用程序上添加 Google map

Question

所以我正在尝试将我制作的静态网站转换为 meteor 应用程序，而不是每个商店有 5 个 html 文件，加上多个 html 标准页面，我将它们全部转换为“一个”单个 html使用指令的文件，问题是当我试图在网站上插入 map 时，由于某种原因它不起作用，我尝试了多种方法但仍然无法在页面上显示标准 map ，更不用说了定制版本..

这里我只是在 html 文件上定义 map (我稍后会更改 id 以显示我想要的每个商店的 map ，或者只是根据我当前在页面上显示的商店更改 lat lng) :

<div id="mapCS" class="map col-xs-12 col-sm-6 col-md-6 col-lg-6">
</div>

这是我在网站的静态版本上使用的 js 文件，它按预期工作(显然在静态版本上):

var map = new google.maps.Map(document.getElementById("mapCS"),
        mapOptions);

    var marker = new google.maps.Marker({
        position: myCenter,
        map: map,
        animation:google.maps.Animation.BOUNCE,
        title: 'Savoie Volailles Cranves Sales',
        icon: {
            url:"img/logo.png",
            scaledSize: new google.maps.Size(80, 64),
        }
    });

    google.maps.event.addListener(map, 'center_changed', function() {
        // 0.1 seconds after the center of the map has changed,
        // set back the marker position.
        window.setTimeout(function() {
            var center = map.getCenter();
            marker.setPosition(myCenter);
        }, 100);
    });
}
google.maps.event.addDomListener(window, 'load', initialize);

我还有一个脚本标签来插入我的 api key ..

Answer 1

使用angularui:angular-google-maps按照推荐here

只需添加依赖项并使用指令调用它。配置选项非常简单，可以从 Controller 完成