Question

每次尝试从API获取新结果时，我都试图从地图中删除标记。我想这样做，以使先前获取的标记不会出现在地图上。我读了Google Maps API documentation，它声明要遍历标记，并在每个标记上使用“ setMap（null）”功能从地图上删除该标记。我在Chrome开发者控制台中不断收到“无法读取未定义'setMap'的'setMap'属性”。

以下代码是我尝试删除标记的方式，它与Google Maps API文档的操作非常相似，只是我没有使用多个功能。相反，我只是检查保存标记的数组是否不为null，然后尝试删除这些标记，并将保存标记的数组设置为null。

glm::rotate()

以下是我的Google Maps组件中script标记内的所有代码。

watch: {
    async events() {
        try {
            const google = await gMaps();

            if(this.locations !== null) {
                for(let i = 0; i < this.locations.length; i++) {
                    this.locations[i].setMap(null);
                }

                this.locations = [];
            }

            this.locations = this.events.map(event => {
                new google.maps.Marker({
                    position: {
                        lat: parseInt(event.latitude, 10),
                        lng: parseInt(event.longitude, 10)
                    },
                    map: this.map,
                    title: event.title
                })
            })
        }
        catch(error) {
            console.error(error)
        }
    }
}

Answer 1

您的full_graph数组不是空的，而是充满了locations个元素（例如undefined）。

由于[undefined, undefined, undefined]已填充在locations中，因此问题一定存在。

是的。作为this.locations = this.events.map(...)的参数，您正在使用带有.map()的箭头函数，并且不返回任何内容。

您的代码等同于：

{}

修复：：您有两个选择：使用较短的版本（不带花括号）或添加this.locations = this.events.map(event => { new google.maps.Marker(...) return undefined; })语句。

卸下括号：

return

或添加退货：

            this.locations = this.events.map(event => // { removed
                new google.maps.Marker({
                    position: {
                        lat: parseInt(event.latitude, 10),
                        lng: parseInt(event.longitude, 10)
                    },
                    map: this.map,
                    title: event.title
                })
            ) // was: })

尝试删除GoogleMaps组件（Vue）中的标记时显示“无法读取未定义'setMap'的属性”

1 个答案: