Mapbox : Loading/Rendering 3D buildings at a large scale - mapbox

I'm trying to display a 3D skyline/panoromic view of Manhattan using Mapbox yet with Mapbox GL extruded 3D buildings start to disappear below zoom level of 15. Is there a way to render/display them at zoom level around 11-12? Or an alternative way by clipping/filtering rendered/loaded data by mapbox?
I have tried to filter the map to the area of Manhattan and Roosevelt islands yet later found out it's not possible to clip/filter MapBox to a geographical area.
As the final result I'm hoping to render the buildings at the final view shown in the last image.

Related

How to make raster tiles in Albers projection or Equidistant Conic?

It`s necessary to make tiles in the non-mercator projection to display them in Leaflet using the Proj4Leaflet library.
How can i do this?
I tried to do it in Qgis, but the result was negative.

GeoServer Vector Tiles show tile boundary issue in Mapbox GL JS

I use GeoServer to provide Vector Tiles (based on the GeoServer Vector Tile Extension) of my biking trails as .pbf.
The data are added as vector source and visualized using Mapbox GL JS.
Additionally, I use the GeoServer perpendicularOffset to offset the lines (as I always have two directions of the biking trail).
A problem occurs when visualizing the data within Mapbox. The lines are cut at the tile edges, although they are visualized correctly using the layer preview on GeoServer.
The further I zoom in the map, the less the clipping of the lines happens and at a very detailed zoom, the lines are drawn correctly.
I already tried to use a large enough buffer and modify the tile size, as these were suggestions when researching the problem. Unfortunately, these settings had no effect.
I have another vector source layer for the base map, there I have no problems.
It seems to me, that offsetting the lines might be a problem.
Any idea what I can try?
the tile size of Geoserver's tile grid is 256x256 , but mapbox need 512x512, add a custom tile grid, set the tile size to 512x512, generate your vector tile with the custom tile grid should be ok.

How to get X and Y indexes of the current tile in Mapbox GL JS?

I'm using Mapbox GL JS to display a map using my own tile-server (which just serves openmaptiles pbf files in a Z/X/Y directory structure).
The loading of tiles is done automatically, based on the current center coordinates.
I want to pre-load the surrounding tiles for an offline solution.
I know how to get the current zoom-level with map.getZoom()
How can I get the X and Y indexes of the current tile URL ?
I suggest framing the problem in terms of geographic coordinates:
You can get the viewport geographic coordinates from Map#getBounds)
You can convert geographic coordinates to tile coordinates with some light math
Also, if you need to do some calculations in bash scripts, you can use mercantile library or CLI utility to transform lon/lan coordinates to tiles, find parent or children tiles and get some other information. Another advanced tool is supermercado.

tilemill creates jagged edges for worldmap

Trying to create a custom world map texture with tilemill to load into leafletjs. I have downloaded a free .tiff file from natural earth data and loaded it into tilemill.
When i want to export however, i notice alot of jagged edges mainly around greenland/canada on the lowest zoom level.
a few zoom levels down and it seems ok again. After exporting the tiles to png's the jagged edges stay. How can i improve the quality of these images?
How can i improve the quality of these images?
By using more detailed input data.
By the looks of it, you are projecting a raster image in EPSG:4326 projection into the EPSG:3857 "web mercator" projection. In the original data, each pixel spans the same amount of longitude and latitude degrees. In a mercator projection, each pixel spans the same amount of longitude, but a different amount of latitude. The artifacts you are experiencing are akin to a Tissot's indicatrix.
You can try using a different value for the raster-scaling symbolizer option in your tilemill stylesheet, but that's gonna make the artifacts different, not get rid of them.

mapbox - loading different geojson choropleth overlays at different zoom levels

so i have a mapbox base map and want to load a dynamic choropleth area map over the top of it. it will cover all continents. i've looked into doing this before using geojson but the resulting file was over 9mb. is there a way to have different geojson vectors loaded at different zoom levels as to reduce the file size ?
the reason the file was so big was because it was a very detailed vector overlay. basically i'd like to replicate the vectors of 'am map' but with the performance of mapbox, with much better vector resolution at bigger zoom levels. (http://www.amcharts.com/javascript-maps/)
the only other way to do this is by using geojson markers that are loaded on top of the base map, but this doesn't give the same visual impact of the fully coloured continent vectors..
any help would be greatly appreciated!
x
Well, you could watch zoomend on the map to add/remove overlays as needed.
map.on('zoomend', function() {
var currentZoom = map.getZoom();
overlayGroup.clearLayers() //remove existing
overlayGroup.addLayer(myZoomLevelMapping[currentZoom]) //add layer for this zoom level.
})