Skip to content

Instantly share code, notes, and snippets.

@gorshkov-leonid
Last active August 19, 2025 11:17
Show Gist options
  • Save gorshkov-leonid/715b82a853b7c1e993c1ed2806393bd3 to your computer and use it in GitHub Desktop.
Save gorshkov-leonid/715b82a853b7c1e993c1ed2806393bd3 to your computer and use it in GitHub Desktop.
mapbox-dump-layer.md
function dumpFeaturesBySources(onlyRendered)
    {
        Object.keys(window.MapboxForDebug.style.sourceCaches).forEach((key)=>dumpFeatures(onlyRendered, key))
    }

    function dumpFeatures(onlyRendered, sourceId) {
        var mapbox = window.MapboxForDebug;
        const logResult = [];
        if (onlyRendered) {
            const dataLayers = sourceId ? mapbox.getStyle().layers.filter(function (layer) { return layer.source === sourceId }) : mapbox.getStyle().layers;
            dataLayers.forEach(function (dataLayer) {
                let sourceLayer = dataLayer["source-layer"];
                let sourceId = dataLayer["source"];
                const features = mapbox.queryRenderedFeatures({layers: [dataLayer.id]});
                if (!features.length) {
                    return;
                }
                debugger;
                logResult.push({
                    layer: dataLayer.id,
                    features: features.map(function (feature) {
                        const featureState = mapbox.getFeatureState({source: sourceId, sourceLayer: sourceLayer, id: feature.id});
                        const mapboxLayer = feature.layer;
                        return ({
                            externalId: feature.properties['ei'/*EXTERNAL_ID*/],
                            id: feature.id,
                            layerType: mapboxLayer.type,
                            dataProps: feature.properties,
                            feature: feature,
                            layer: mapboxLayer,
                            state: featureState
                        })
                    })
                })
            });
        }
        else {
            const sourceLayerIds = [];
            const sourceLayersIdsSet = new Set();
            const layers = sourceId ? mapbox.getStyle().layers.filter(function (layer) { return layer.source === sourceId }) : mapbox.getStyle().layers;

            layers.map(function (layer) {
                return layer["source-layer"]
            }).forEach(function (sourceLayerId) {
                if (!sourceLayersIdsSet.has(sourceLayerId)) {
                    sourceLayersIdsSet.add(sourceLayerId);
                    sourceLayerIds.push(sourceLayerId);
                }
            });

            sourceLayerIds.forEach(function (sourceLayerId) {
                const features = mapbox.querySourceFeatures(sourceId, {sourceLayer: sourceLayerId});
                if (!features.length) {
                    return;
                }
                logResult.push({
                    layer: sourceLayerId,
                    features: features.map(function (feature) {
                        const featureState = mapbox.getFeatureState({source: sourceId, sourceLayer: sourceLayerId, id: feature.id});
                        return ({
                            externalId: feature.properties['ei'/*EXTERNAL_ID*/],
                            id: feature.id,
                            tile: feature.tile,
                            dataProps: feature.properties,
                            state: featureState
                        })
                    })
                })
            });

        }
        console.log("Source: ", sourceId, ",", "Features: ", logResult);
    }
window.MapboxForDebug.showTileBoundaries = true;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment