求助：获取Mapbox矢量文件JSON/GeoJSON并本地复现地图示例

Hey there! I totally get the frustration of trying to grab that sample data for local customization—let’s break down how you can get your hands on mapbox://mapbox.04w69w5j as a downloadable GeoJSON/JSON file.

First, Understand the Source #

That mapbox:// URL points to a Mapbox-hosted vector tile set, not a raw GeoJSON file. Vector tiles are split into small, optimized chunks, so we need to convert or export them into a single GeoJSON file for local use.

Method 1: Export via Mapbox Studio (Easiest) #

If you have a Mapbox account (free tier works):

• Log into Mapbox Studio and navigate to the Datasets tab.
• Search for the dataset ID 04w69w5j (this is the public dataset behind that tile set).
• Once you open it, look for the Export button in the top-right corner.
• Choose GeoJSON as the export format, select the area you need (or the whole dataset), and download the file.

Method 2: Extract Vector Tiles & Convert to GeoJSON #

If you don’t want to use Mapbox Studio, you can pull the vector tiles directly and convert them:

1. Grab the vector tile URLs: Open the original example in your browser, open DevTools (F12), go to the Network tab, and filter for "vector" requests. You’ll see URLs like https://api.mapbox.com/v4/mapbox.04w69w5j/{z}/{x}/{y}.vector.pbf?access_token=...
2. Download tiles: Use a tool like curl to download the tiles you need (replace {z}/{x}/{y} with actual tile coordinates from the network requests):

   curl "https://api.mapbox.com/v4/mapbox.04w69w5j/10/341/692.vector.pbf?access_token=YOUR_MAPBOX_TOKEN" -o tile.pbf
   

3. Convert PBF to GeoJSON: Use a command-line tool like tippecanoe or tile-join (part of the tippecanoe suite) to convert the PBF tiles into a single GeoJSON file:

   tile-join -o output.geojson tile.pbf
   

   Note: You’ll need to install tippecanoe first via homebrew or other package managers.

Method 3: Use Browser DevTools to Extract Feature Data #

A quick workaround if you just need a subset of the data:

• Open the example, zoom to the area you care about.
• In DevTools, go to the Console tab and run this snippet to extract visible features (adjust the layer name if needed—check the example code for the layer ID):

  map.queryRenderedFeatures({ layers: ['your-layer-id'] }).forEach(feature => {
    console.log(JSON.stringify(feature));
  });
  

• Copy the output from the console, paste it into a file, and wrap it in an array to make valid GeoJSON.

Pro Tip for Customization #

Once you have the GeoJSON, you can modify it with any text editor or GIS tool (like QGIS) to match your custom data structure. Remember to update the example code to load your local GeoJSON instead of the Mapbox tile set—use map.addSource() with a geojson type pointing to your local file path.

内容的提问来源于stack exchange，提问作者PKA