Combining Bubble Layer and HTML Marker Layer

[zec-hue]

Please provide us with the following information:

This issue is for a: (mark with an x)

- [ ] bug report -> please search issues before submitting
- [ ] feature request
- [x] documentation issue or request
- [ ] regression (a behavior that used to work and stopped in a new release)

Minimal steps to reproduce

Create a map with both Bubble Layer and HTML Marker Layer. Add HTML Marker Layer event. Add Bubble Layer event to Bubble Layer. Add Symbol Layer Populate map data source with some form of GeoJson data using atlas.data.FeatureCollection Implement filter in Symbol Layer to show single cluster bubble Render HTML using the markerRenderCallback event in the HtmlMarkerLayer

Any log messages given by the failure

Expected/desired behavior

Ability to access map from

OS and Version?

Windows 10

Versions

HTML Marker Layer typescript file from 2020-12-11

Mention any other details that might be useful

Quite a few questions in mind.

1. How does HTML Marker Layer differ from the Bubble Layer?
2. Is having both together ideal?
3. Should it just be 1 or the other?
4. Should both layers simply have inheritance of functions / methods?
5. Where do I get more information about the similarities and differences of both HTML and Bubble Layer.
6. Bubble Layer specific question; from the Bubble Layer getClusterLeaves function, how do we get access to the map? I understand that e.shapes[0].map.map allows that on the proviso that "e" is a Point but what why is do I get a Feature type in e when combining both HTML Marker and Bubble Layer?

   ---

   Thanks! We'll be in touch soon.

[rbrundritt]

1. The HTML Marker layer uses the bubble layer under the hood to create the connection between the native data sources and the HTML markers. That said, the rendered elements are very different as bubble layer will render circles via GPU/canvas, while HTML marker layer renders DOM elements within the page. HTML markers are often preferred in simple apps where traditional web devs want to use CSS to style rather than JS options.
2. If you mean, in terms of how the HTML marker layer works, wrapping the bubble layer provides a lot of benefits with little effort (support for clustering, icon/symbol collision support, ability to connect to a data source). If you mean adding your own bubble layer in addition to a html marker layer connected to the same data source, that is fine and useful in some scenarios.
3. see above.
4. Creating a purely native layer for HTML markers isn't an option as native layer/data source processing happens on the GPU where traditional DOM elements don't exist.
5. See #1. The key difference is bubble layer renders on the GPU and supports hundreds of thousands of points, while HTML marker renders in the DOM and is good for maybe one thousand points, but provides traditional HTML/CSS styling options.
6. All layers have a getMap function, call that.