4

我有一个谷歌地图，如果完成了特殊的用户交互，我正在使用一个 hacky 的 infowindows 解决方案，它不会显示在覆盖谷歌地图的 div 下。

我在用户交互后执行此代码：

var controlDiv = document.createElement('div');
controlDiv.style.width = '220px';
controlDiv.style.height = '500px';
map.controls[google.maps.ControlPosition.RIGHT_TOP].push(controlDiv);

效果很好，但是如果用户关闭覆盖，我想删除我推入数组的元素。

我试图把它拼接出来，但我不知道如何选择它，或者它的索引是什么。

map.controls[google.maps.ControlPosition.RIGHT_TOP].splice("?", 1);

其他可能性可能是

delete map.controls[google.maps.ControlPosition.RIGHT_TOP]

但我只是没有删除元素plesea帮助提前谢谢

4

2 回答 2

11

map.controls[google.maps.ControlPosition.RIGHT_TOP] 不是原生数组，它是google.maps.MVCArray

当您仅将这个单个自定义控件添加到数组时，您可以简单地调用：

map.controls[google.maps.ControlPosition.RIGHT_TOP].clear();

当有更多自定义控件时，遍历控件以查找索引controlDiv并调用

map.controls[google.maps.ControlPosition.RIGHT_TOP].removeAt(index);

另一种方法：不是添加/删除控件，而是添加一次控件并切换display.controlDiv

于 2013-11-13T17:13:01.393 回答
3

我发现setAt()andremoveAt()方法不适用于地图控件。Google 仅在其代码示例中使用push()和方法。clear()

此外，display在隐藏和重新显示控件后，该属性可能会导致控件相互叠加。我发现该visibility物业效果最好。在具有谷歌地图样式的自定义控件构造函数和显示/隐藏控件的方法下方。

function CustomControl(options) { // constructor
    "use strict";
    this.div = document.createElement('div');
    this.div.style.visibility = "visible";
    var controlUI = document.createElement('div'); // Set CSS for the control border
    controlUI.style.backgroundColor = '#fff';
    controlUI.style.backgroundClip = 'padding-box';
    controlUI.style.border = '1px solid rgba(0, 0, 0, 0.15)';
    controlUI.style.borderRadius = '2px';
    controlUI.style.boxShadow = 'rgba(0,0,0,.3) 0px 1px 4px -1px';
    controlUI.style.cursor = 'pointer';
    controlUI.style.margin = '5px 5px 15px';
    controlUI.style.minWidth = '120px';
    controlUI.style.textAlign = 'left';
    controlUI.style.position = 'relative';
    if (options.title) {
        controlUI.title = options.title;
    }
    if (options.visibility) { // "visible" or "hidden"
        controlUI.style.visibility = options.visibility;
    }
    this.div.appendChild(controlUI);
    var controlText = document.createElement('div'); //Set CSS for the control interior
    controlText.style.color = 'rgb(25,25,25)';
    controlText.style.fontFamily = 'Roboto,Arial,sans-serif';
    controlText.style.fontSize = '11px';
    controlText.style.fontWeight = '500';
    controlText.style.padding = '1px 6px';
    if (options.text) {
        controlText.innerHTML = options.text;
    }
    controlUI.appendChild(controlText);
    if (options.index) {
        this.div.index = options.index;
    }
    if (options.handler) {
        google.maps.event.addDomListener(controlUI, 'click', options.handler);
    }
    if (options.position) {
        this.position = options.position;
    }
    if (options.sequence) {
        this.sequence = options.sequence;
    }
    this.setVisible = function(bolean) { // method
        var visibility;
        if (bolean) { //true
            visibility = "visible";
        } else {
            visibility = "hidden";
        }
        controlUI.style.visibility = visibility;
    }
}
于 2015-09-01T13:53:10.963 回答