rlayers icon indicating copy to clipboard operation
rlayers copied to clipboard

rlayers adds a large number of empty `<div>` tags in the map element

Open mmomtchev opened this issue 3 years ago • 1 comments

rlayers adds a large number of empty <div> tags in the map element

<div class="map" style="cursor: pointer;">
    <div class="ol-viewport" style="position: relative; overflow: hidden; width: 100%; height: 100%;">
        <div class="ol-unselectable ol-layers" style="position: absolute; width: 100%; height: 100%; z-index: 0;">
            <div class="ol-layer" style="position: absolute; width: 100%; height: 100%;"><canvas width="833" height="748"
                    style="position: absolute; left: 0px; transform-origin: left top; transform: matrix(1, 0, 0, 1, 0, 0);"></canvas></div>
        </div>
        <div class="ol-overlaycontainer" style="position: absolute; z-index: 0; width: 100%; height: 100%; pointer-events: none;"></div>
        <div class="ol-overlaycontainer-stopevent" style="position: absolute; z-index: 0; width: 100%; height: 100%; pointer-events: none;">
            <div class="ol-zoom ol-unselectable ol-control" style="pointer-events: auto;"><button class="ol-zoom-in" type="button" title="Zoom in">+</button><button class="ol-zoom-out" type="button"
                    title="Zoom out">–</button></div>
            <div class="ol-rotate ol-unselectable ol-control ol-hidden" style="pointer-events: auto;"><button class="ol-rotate-reset" type="button" title="Reset rotation"><span class="ol-compass"
                        style="transform: rotate(0rad);">⇧</span></button></div>
            <div class="ol-attribution ol-unselectable ol-control ol-uncollapsible" style="pointer-events: auto;"><button type="button" aria-expanded="true" title="Attributions"><span
                        class="ol-attribution-collapse">›</span></button>
                <ul>
                    <li>© <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a> contributors.</li>
                </ul>
            </div>
        </div>
    </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>

mmomtchev avatar Oct 01 '22 09:10 mmomtchev

These divs are necessary and correspond to each React component on the map - without any DOM element to bind to React is unable to properly handle component updates.

Should a future version of React do not rely on having DOM elements, these might be removed.

mmomtchev avatar Oct 01 '22 09:10 mmomtchev