0

I am using Vue.js 3, Leaflet and Vueleaflet. My map displays the layers groups containing markers (LLayerGroup) :

Map layers groups

I want to add "Select all" / "Unselect all" checkboxes at the top of the groups checkboxes. Is there a way to easily custom Layer and group control element in Vue Leaflet to achieve this ?

Here is my vue template code :

    <l-map
      :zoom="zoom" 
      :center="center" 
      :options="{ attributionControl: false }"
      @update:zoom="zoomUpdated" 
      @update:center="centerUpdated" 
      @update:bounds="boundsUpdated">
      <l-tile-layer
      v-for="tileProvider in tileProviders"
      :key="tileProvider.name"
      :name="tileProvider.name"
      :visible="tileProvider.visible"
      :url="tileProvider.url"
      layer-type="base"/>
      <l-control-layers position="topright"></l-control-layers>
      <l-layer-group
          v-for="bGroup in groupsMarkers" 
          :key="bGroup.groupId" layer-type="overlay" :name="bGroup.groupName" :visible="true">
              <MapMarker
              v-for="marker in bGroup.markers" 
              :key="marker.baliseId"
              :id="marker.baliseId"
              :name="marker.baliseName"
              />
      </l-layer-group>
    </l-map>

0