Question

我原来已经发布了这个问题，但不会让我编辑帖子也不会辞职。在此我希望重新关注并明确我要求的内容。

我在Google Maps Api的回调函数中定义了我的地图。 initMap肯定是第一次被召唤。一旦我是手动触发addVehicleMarker方法。

这是在HTML方面调用的方式：

// index.html

<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>
<script defer src="../src/map-manager.js"></script>

这就是我在initMap下面所做的事情：

// map-manager.initMap

map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: home_latlng,
    streetViewControl: false
});

我的问题

我想在其他地方导入map-manager.js课程。主要用于addVehicleMarker方法。当我做以下事情时......

var MapManager = require('../src/map-manager');
MapManager.addVehicleMarker(v);

map中的

map-manager.js现在未定义。我什么时候......

addVehicleMarker(v);

map中的

map-manager.js包含我在initMap中定义的地图。没有我甚至不必导入文件。

问题

我如何才能在addVehicleMarker(v);中实现相同的功能，同时允许我正确导入并将其称为MapManager.addVehicleMarker(v);，同时保留map？

这是其余的来源：

// map-manager.js

var VehicleManager = require('../src/vehicle-manager');
var WampTasks = require('../src/wamp-tasks');

var map;
var vehicleMarkers = [];

function initMap() {
    const home_latlng = {
        lat: 33.816714399999995,
        lng: -117.90523610000001
    };

    map = new google.maps.Map(document.getElementById('map'), {
        zoom: 15,
        center: home_latlng,
        streetViewControl: false
    });
}

// http://blog.mridey.com/2010/03/using-markerimage-in-maps-javascript.html
function addVehicleMarker(vehicle) {
    console.log(map);
    var icon = new google.maps.MarkerImage(
        vehicle.iconLocation,
        null, /* size is determined at runtime */
        null, /* origin is 0,0 */
        null, /* anchor is bottom center of the scaled image */
        new google.maps.Size(32, 32)
    );
    var marker = new google.maps.Marker({
        position: vehicle.currentLatLng,
        icon: icon,
        map: map
    });
    console.log(marker);
    // marker.setTitle(String(vehicle.displayName));

    vehicleMarkers.push(marker);
    console.log(vehicleMarkers);
}

module.exports = {};
module.exports["addVehicleMarker"] = addVehicleMarker;

Answer 1

似乎是一个范围问题。在窗口级别声明var map（如果presente其他嵌套var maps; delacration

，则删除

<script>
  var map;
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 15,
    center: home_latlng,
    streetViewControl: false
 });
 ....
</script>

我的一个变量是在initMap中设置的，但当我在脚本中调用另一个函数时，同一个变量突然未定义

我的问题

问题

这是其余的来源：

1 个答案: