Add/remove custom controls dynamically

[paodb]

Feature proposal

Currently there seems not possible to add and remove custom controls dynamically (taken from https://github.com/FlowingCode/GoogleMapsAddon/issues/127#issuecomment-2113398747)

[JariHanah]

Thanks for openning this issue, Currently I have a use case where I need to navigate between data presented on the map. I have fixed buttons, I also have buttons that might be added by the user to filter the data. The user might ask to remove some filters all together,

I can possibly use the setCustomControls you recommended with removeAllCustomButtons you plan to add.

[JariHanah]

To help with this,

I have written a code as a work around that solves the issue. Even though the issue seems resolved with this code, after some updates and resetting the buttons, occasionally some of the newly inserted buttons gets inserted in a different position. not sure why, if it was a plugin or a google issue, or my code issue, .. or what is causing it. In any case, this new setCustomControls method, does help me add and remove buttons dynamically.

` new Subclass to make getJson public static class CustomControl2 extends CustomControl { CustomControl2(Button b, ControlPosition pos) { super(b, pos); }

    public JsonObject getJson(int i) {
        return super.getJson(i);
    }
}

stores the elements to be removed if requested by user

List<Element[]> elements = new ArrayList<>();

this method can be called many times to reset the buttons with new buttons.

public void setControls(CustomControl2[] customControls) {
    JsonArray jsonArray = Json.createArray();
    elements.forEach(element -> {
        Arrays.stream(element).forEach(element1 -> {
            if (element1 != null) {
                gmaps.getElement().removeChild(element1);
            }
        });

    });
    elements.clear();
    for (int i = 0; i < customControls.length; ++i) {
        CustomControl2 customControl = customControls[i];
        jsonArray.set(i, customControl.getJson(i));
        customControl.getControlButton().getElement().setAttribute("slot", "customControlSlot_" + i);
        Element p = gmaps.getElement();
        Element[] e = new Element[]{customControl.getControlButton().getElement()};
        gmaps.getElement().appendChild(e);
        elements.add(e);
    }
    gmaps.getElement().setPropertyJson("customControls", jsonArray);
}

`

[JariHanah]

Another Workaround I did, 1 Is that I added all buttons into the MAP one time (so that I call setCustomControls one time, 2 then I control the visibility of the buttons with button.setVisible();

However, seems when you hide then show the buttons, the buttons are stacked over one another. To solve this, run a setZoom(7), then a setZoom(1) this seems to force to reposition the buttons.(do this in separate threads)