Binding multiple tooltips to a single Leaflet marker

Question

My goal is to create a map with circle markers using the Leaflet map library and add text next to the marker.

Each marker represents a location and for each location I want to show 4 numerical values associated with that particular location. Each label has a different position and text color: one is above the marker, one below, one on the right, one on the left.

I achieved this, but it does not seem like the most efficient way of doing this and it takes longer to load because I think my solution is overcomplicated.

First I create the markers with no tooltip, just a circular marker. To add the text, I then created another 4 sets of circular markers, with the same lat/lng, but invisible (defined by 0% opacity) and associate each of these with one of the tooltips.

Example of two:

L.geoJSON(data, {
    pointToLayer: function (feature, latlng) {
        return L.circleMarker(latlng, {
            radius: 8,
            fillColor: color,
            color: "#000",
            weight: 0,
            opacity: 0,
            fillOpacity: 0
        });
    },
    onEachFeature: onEachFeatureStationT
}).addTo(geoLayer);
L.geoJSON(data, {
    pointToLayer: function (feature, latlng) {
        return L.circleMarker(latlng, {
            radius: 8,
            fillColor: color,
            color: "#000",
            weight: 0,
            opacity: 0,
            fillOpacity: 0
        });
    },
    onEachFeature: onEachFeatureStationH
}).addTo(geoLayer);

As you can see, each of the layers is associated with a different onEachFeature function. Then I define each of the onEachFeature functions and associate one of the tooltips with it, like this:

function onEachFeatureStationT(feature, layer) {
    if (feature.properties && feature.properties.name) {
        layer.bindTooltip(feature.properties.valT, {
            permanent: true, 
            className: "markerLabelFullT", 
            offset: [0, -15],
            direction: 'center'
        });
    }
}
function onEachFeatureStationH(feature, layer) {
    if (feature.properties && feature.properties.name) {
        layer.bindTooltip(feature.properties.valH, {
            permanent: true, 
            className: "markerLabelFullH", 
            offset: [-20, 0],
            direction: 'center'
        });
    }
}

In each of the onEachFeature function I have a different className, thus achieving different stylig (font color) and different offset, achieving different position. I have four of these for each of the tooltips (above, left, right, below).

The above solution works and it indeed displays a marker in the center of four textual labels around it with different positions and colors.

However, this means I am creating four extra sets of helper markers and it therefore takes longer to load.

My question is, whether it is somehow possible to bind more than just one tooltip to a single marker. In other words, if it is possible to define either more onEachFeature functions for each marker or if within one onEachFeature function I can add multiple tooltips.

I also tried this:

function onEachFeatureStationT(feature, layer) {
    if (feature.properties && feature.properties.name) {
        layer.bindTooltip(feature.properties.valT, {
            permanent: true, 
            className: "markerLabelFullT", 
            offset: [0, -15],
            direction: 'center'
        });
        layer.bindTooltip(feature.properties.valH, {
            permanent: true, 
            className: "markerLabelFullH", 
            offset: [20, 0],
            direction: 'center'
        });
    }
}

However binding two tooltips like this results with only one tooltip being added (the latter one) and the first one being ignored (overwritten).