mapbox / mapbox-gl-js

Interactive, thoroughly customizable maps in the browser, powered by vector tiles and WebGL
https://docs.mapbox.com/mapbox-gl-js/
Other
11.19k stars 2.22k forks source link

3rd party batch model (b3dm) in Mapbox v3? #12861

Open bertt opened 1 year ago

bertt commented 1 year ago

Hi, is there some information/minimal sample (without compression) of visualizing a b3dm in Mapbox v3?

I'm retrieving the b3dm using:

map.addSource('tiles', {
        "type": "batched-model",
        "maxzoom": 14,
        "minzoom": 14,
        "tiles": [
          "https://myserver/{z}-{x}-{y}.b3dm"
        ]
      }
)});

questions:

Any other requirements in the glTF? Draco compression? MAPBOX_mesh_features extension? mapbox:footprint:id/mapbox:coordinate-space/mapbox:footprint-quantized/mapbox:footprint-version/mapbox:tile-version?

astojilj commented 1 year ago

Thanks @bertt

For the context, pasting earlier comment https://twitter.com/astojilj/status/1693498420579766656?s=20

_Mapbox tiles use Z-up orientation with Z in meters and X and Y in tile coordinates https://github.com/mapbox/mapbox-gl-js-internal/blob/94c7b65cdc8a861eeddd12e4f726407984e8c879/3d-style/render/draw_model.js#L741. Please, use https://github.com/mapbox/mapbox-gl-js to request and then track progress on supporting 3rd party tiles that follow 3D Tiles 1.0 and 3D Tiles Next._

Note that this is experimental functionality, and we don't plan to support experiments with custom b3dm tiles while we are focusing on developing Standard Style. Our future plans include 3D Tiles Next support, but I cannot share any details now.

What x, y coordinates to use in the glTF? epsg:3857? absolute or relative to the tile? Relative to what?

It follows Web Mercator projection (epsg:3857) - Mapbox Vector Tile Format https://docs.mapbox.com/style-spec/reference/sources/#vector.

All geometric coordinates in vector tiles must be between -1 extent and (extent 2) - 1 inclusive

EXTENT: https://github.com/mapbox/mapbox-gl-js/blob/068a7f32954b3cb3d0754ec0e263b816a9eb3fd1/src/style-spec/data/extent.js#L18

bertt commented 8 months ago

Got a step further, see https://bertt.github.io/mapbox_3dtiles_samples/samples/standard/dam_square/ (MapBox version v3.1.2)

image

Loading tileset:

map.addSource('bag-3d', {
        "type": "batched-model",
        "maxzoom": 15,
        "minzoom": 15,
        "tiles": [
          "https://bertt.github.io/mapbox_3dtiles_samples/samples/standard/dam_square/tiles/{z}-{x}-{y}.glb"
        ]
      }
)});

// add the custom style layer to the map
map.on('style.load', () => {
  map.addLayer({
    id: 'bag-layer',
    type: 'model',
    source: 'bag-3d',          
  });
});

There is one glb (15-16829-10768.glb), center should be at Amsterdam Dam Square ( image ). In this demo I used in the vertex coordinates between 3500 and 3600 after trial and error, to get the model on the Dam square. When using 0,0 the model is drawn on the top left of the tile.

So I image the model vertex coordinates are relative to the upper left of the tile.

astojilj commented 8 months ago

@bertt Yes, the tile coordinate X increases from left to right in range [0 .. 8192), and Y increases [0 .. 8192) from north to south. Now, we use single zoom 14 .glb tiles only.

I would like to understand your use case better as we are working on a number of things:

https://github.com/mapbox/mapbox-gl-js/issues/13009#issuecomment-1900849976

Note the approaches for hiding all 3D content from Standard Style and the "conflation" part related to bringing own 3D models to the map, which would hide overlapping Mapbox 3D content.

bertt commented 8 months ago

@astojilj main use case for now is getting something similar as build in CesiumJS:

https://geodan.github.io/pg2b3dm/sample_data/3dbag/sibbe/

Screenshot 2024-02-26 194916

Main features:

bertt commented 8 months ago

Delaware buildings https://bertt.github.io/mapbox_3dtiles_samples/samples/standard/delaware/ image

astojilj commented 8 months ago

cc @jtorresfabra

bertt commented 8 months ago

q: Is there a sample of click on 3D Tiles (b3dm) and show attributes?

bertt commented 8 months ago

Dutch 3D Bag https://bertt.github.io/mapbox_3dtiles_samples/samples/standard/tienhoven/ image

Note: these are 3D Tiles 1.1 glb's (not b3dm's) containing EXT_Structural_Metadata for building attribute info.

astojilj commented 8 months ago

@bertt

Work on query render features support for Model Layer is in progress. However, we are not working on supporting 3rd party 3D tiles yet. Mapbox nodes encode ids in extras, for now:

image

enersis-pst commented 8 months ago

@astojilj is there a official roadmap? would be nice to know what will come :-)