donde pongo el codigo siguiente

[dairo65]

saludos y gracias por apoyar al novato
les comento tengo un codigo en js el cual es de mapbox y tuengo la localizacion y todo

Código Javascript:

var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/streets-v9',
    center: [-73.58, 3.70], 
    zoom: 5
});
 
document.getElementById('btnGuardar').onclick =  function(e){
    guardarLocalizacion();
};
 
// Adicionando controles de zoom y rotación
map.addControl(new mapboxgl.NavigationControl());
 
var localizador = new mapboxgl.GeolocateControl({
    positionOptions: {
        enableHighAccuracy: false
    },
    trackUserLocation: false,
    showUserLocation: false
});
 
map.addControl(localizador); //Adicionar control localizador
 
var geojson;
 
//Evento que se activa al momento de activar la localización
localizador.on('geolocate', function(e) {
    var lat = e.coords.latitude;
    var lng = e.coords.longitude;
 
    geojson = {
        type: 'FeatureCollection',
        features: [
        {
            type: 'Feature',
            geometry: {
                type: 'Point',
                coordinates: [lng, lat]
            }
        }]
    };
 
    document.getElementById('lat').textContent  = lat;
    document.getElementById('lng').textContent  = lng;
 
   
 
        map.addLayer({
            "id": "punto",
            "type": "symbol",
            "source": {
                "type": "geojson",
                "data": {
                    type: 'FeatureCollection',
                    features: [
                    {
                        type: 'Feature',
                        geometry: {
                            type: 'Point',
                            coordinates: [lng, lat]
                        }
                    }]
                }
            },
            "layout": { 
                "icon-image": "local",
                "icon-size": 0.25
            }
        });
 
    });
 

y quisiera poner un mensaje que esta en este codigo;

Código Javascript:

#marker {
    background-image: url('/mapbox-gl-js/assets/washington-monument.jpg');
    background-size: cover;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
}
 
.mapboxgl-popup {
    max-width: 200px;
}
 
 
 
var monument = [-77.0353, 38.8895];
var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/light-v9',
    center: monument,
    zoom: 15
});
 
// create the popup
var popup = new mapboxgl.Popup()
    .setText('Construction on the Washington Monument began in 1848.');
 
// create DOM element for the marker
var el = document.createElement('div');
el.id = 'marker';
 
// create the marker
new mapboxgl.Marker(el)
    .setLngLat(monument)
    .setPopup(popup) // sets a popup on this marker
    .addTo(map);
 

pero no se en que parte del codigo lo ubico ya que si lo pongo al final me da error
alguna idea?

muchas gracias ya que en js soy muy novato