Wix and mapbox integration (CMS)

Question

Good morning,

I am creating a site on Wix. I created a CMS database with dynamic pages. It works very well. I would however like to add a map for each trip (each page is one trip). So I created a Velo javascript table with the list of points to display on the map. Can you help me display these points dynamically (i.e. depending on the page we are on)? I can't connect the blank generic HTML map on the page with the table in my CMS.

`import wixData from 'wix-data';

$w.onReady(function () { // Récupérer les données de votre tableau JavaScript const pointsOfInterest = [...]; // Remplacez les points d'intérêt par votre tableau JavaScript

// Récupérer l'élément de carte
const mapElement = $w('#votre_id_de_carte').value; // Remplacez 'votre_id_de_carte' par l'ID de votre élément de carte

// Initialiser la carte Mapbox
mapboxgl.accessToken = 'YOUR_MAPBOX_ACCESS_TOKEN';
const map = new mapboxgl.Map({
    container: mapElement,
    style: 'mapbox://styles/mapbox/streets-v11',
    center: [0, 0], // Coordonnées de départ (peu importe car nous allons ajuster la vue)
    zoom: 10 // Niveau de zoom initial
});

// Ajouter des marqueurs pour chaque point d'intérêt
pointsOfInterest.forEach(point => {
    new mapboxgl.Marker()
        .setLngLat(point.coordinates)
        .setPopup(new mapboxgl.Popup().setHTML(`<h3>${point.name}</h3><p>${point.description}</p>`))
        .addTo(map);
});

// Ajuster la vue pour inclure tous les marqueurs
const bounds = new mapboxgl.LngLatBounds();
pointsOfInterest.forEach(point => {
    bounds.extend(point.coordinates);
});
map.fitBounds(bounds, { padding: 50 });

});`

To summarize, each trip contains a list of points to display on the map. What I can't do is connect this table to my map to display them.