Can custom HTML be anchored to the side of a map?

[BenJackGill]

I have custom HTML that I want to always be positioned on the left side of the map.

At the moment I think the only solution for custom HTML is to use the CustomMarker.

But a CustomMarker is positioned directly on the map using lat and lng map coordinates, like this:

<CustomMarker :options="{ position: { lat: 39.9511163, lng: -75.1651992 }, anchorPoint: 'LEFT_CENTER' }">
    my custom stuff here
</CustomMarker>

Rather, I would like to position it to the side of the map div using CSS and px, so that it stays on the left side of the map no matter where the map is shown on the globe. For example, something like this (which obviously doesn't work):

<CustomMarker style="margin-left: 100px">
    my custom stuff here
</CustomMarker>

Here is a visual example of what I am trying to create. The circle markers can be added to the map using <CustomMarker> and positioned on the globe using lat and lng. But the scrollable list on the left needs to be positioned to left of the map div, regardless of the position of the map.

How can I anchor HTML to the side of the map like that?

[HusamElbashir]

Maybe you can use a CustomControl for this?
https://github.com/inocan-group/vue3-google-map#custom-control

[BenJackGill]

Yes that looks like what I need! Thanks.

But there was a typo in your comment, I think you meant to say CustomControl not CustomMarker.

[HusamElbashir]

Yes apologies meant CustomControl. Edited.