Questions tagged [mapbox-gl-js]

A WebGL JavaScript interactive maps library that can render Mapbox Vector Tiles.

Filter by
Sorted by
Tagged with
7
votes
2answers
7k views

Mapbox GL: Possible to move navigation controls?

Would anyone know if it is possible to move the navigation controls from top-right to top-left? By default, it is top-right, but I would like to add a company's logo at that position and I've seen ...
6
votes
1answer
6k views

Removing events map.on(“click”…) from mapbox gl?

I am removed the layers with map.removeLayer("clusters"); but got this error evented.js:111 The layer 'clusters' does not exist in the map's style and cannot be queried for features. as I have ...
6
votes
1answer
4k views

highlight feature with click in mapbox gl

I have a geojson layer of streets that are highlighted when moused-over. My objective is now to highlight individual streets red with a click event. Only one street should be able to be ...
6
votes
1answer
3k views

Create my own MapBox Vector tile and self hosting

I understood hosting mbtiles is possible and some solutions are available. I not sure that I can find the answer; How can I create my own vector tiles (mapbox vector tile format) which from my data ...
6
votes
3answers
2k views

Mapbox open source possible?

New to this, but played with Mapbox. My interest lies in creating really good looking slippy maps, I am a web developer so I am interested in both the creation and interacting with the data using a ...
5
votes
1answer
3k views

mapbox gl expression to match multiple values

i have a layer that i want to filter by multiple values stored in array let filter = ['in','id', 1,2,3] map.setFilter('layer_name',filter) this works fine and it will return only features with ID 1,...
5
votes
1answer
402 views

Mapbox vector tiles version 2 MVTv2 and Geoserver 2.13.x

I use WMS on Geoserver to display MVTs in conjunction with mapboxgl.js v0.45.0. A OSM road layer renders 1:1 on top of the Mapbox base layer, so far so good. However, I got a warning from the js ...
5
votes
2answers
3k views

Adding geojson to Mapbox GL JS

Seem to be having problems adding a geojson featurecollection to Mapbox GL JS. What is the most efficient way to accomplish this? I've looked through the examples given on their site but they involve ...
5
votes
2answers
2k views

Mapbox GLJS - group layers

I'm trying to build an interactive map, without any knowledge in javascript, and i found myself a bit lost in this large world. I've already designed my style in mapbox studio. And now, trying to ...
5
votes
1answer
1k views

Filtering a layer based on property that's an array in with Mapbox GL JS?

I've got a relational dataset broken into two layers: members and organizations. They're GeoJSON, with features that look something like this: // Org Features { "type": "Feature", "geometry": { ...
4
votes
4answers
9k views

How to test if a layer exist in a MapBox GL JS map?

I load a GeoJSON layer in a MapBox GL JS map in this way .... map.addSource("route", { "type": "geojson", "data": { "type": "Feature", "properties": {}, ...
4
votes
1answer
2k views

How to get geometry of clicked feature?

From Mapbox's documentation, I should get a GeoJson feature object when I call queryRenderedFeatures method. I run it from a click event without any filter: this.map.on("click", function(e) { ...
4
votes
1answer
2k views

Alternative to Tippecanoe for generating Mapbox vector tiles on command-line

Tippecanoe is the tool I always use for converting Shapefiles/GeoJSONs to Mapbox vector tiles in PBF format, for rendering in Mapbox-GL-JS. But it doesn't seem ideal: its primary use case seems to be ...
4
votes
0answers
119 views

Fixing buildings that do not appear in 3D using Mapbox gl js?

I'm trying to adopt this Display buildings in 3D example, but I found out that in my city (Minsk, Belarus) some buildings look flat like this: The coordinates of this particular building are 27....
4
votes
0answers
612 views

Mapbox GL JS style vector tile interaction in OpenLayers?

I am currently researching different approaches for integrating vector tiles (especially MVT and/or GeoJSON tiles, served from GeoServer) with OpenLayers (^4.0.0) in a manner that would retain access ...
4
votes
0answers
754 views

mapbox styling of vector tiles with many features in openlayers 4

I am trying to process a vector tile source in OpenLayers using the VectorTile layer and source in OpenLayers 4.1. The backend is serving pbf (mvt-based) tiles from an mbtiles source. The tiles have ...
3
votes
4answers
5k views

Mapbox GL JS - “Source Loaded” event

I'm adding a vector tile source to my Mapbox GL js map like this: this.map.on('load', () => { this.map.addSource('userSource', { type: 'vector', url: 'mapbox://&...
3
votes
2answers
1k views

geojson to mapbox vector tile in nodejs

I'm looking for a way to transform geoJson (obtained from a query to potsgis) to mapbox vector format, serverside in nodejs, without using mapnik (I dont have access to the server and therefore cannot ...
3
votes
2answers
5k views

Mapbox Vector Tiles from Geoserver 2.11 in Mapbox GL JS

I am running Geoserver 2.11.0, have installed the vector tiles extension and enabled the application/x-protobuf,type=mapbox-vector tile format. Requesting vector tiles from my server using OL3 works ...
3
votes
1answer
878 views

Self hosting vector tiles

I'm building a web application, which involves (currently) a REST backend and a frontend SPA. The backend is hosting massive geo-enabled data, and the frontend is displaying it on a mapbox map. I'm ...
3
votes
1answer
2k views

Is there a Mapbox GL renderer that outputs SVG?

I have a vector tile source and a Mapbox GL style sheet and would like to produce vector images (SVG) with them. The renderers I found only render in canvas client-side or PNGs server-side. Any ideas?...
3
votes
1answer
356 views

Storing a Mapbox-hosted vector tileset in a variable (Mapbox-GL-JS)

I'm trying to make a map using Mapbox GL that is basically identical to this example: https://www.mapbox.com/mapbox-gl-js/example/filter-markers/. The main difference that source I'm using is a ...
3
votes
1answer
2k views

Building an interactive web map that displays table data in a static portion of the page separate from the map?

I am trying to build an interactive web map to display the results of my master's thesis. Basically, it is a shapefile of line segments that have each been assigned to 1 out of 8 categories. The ...
3
votes
1answer
572 views

What is difference between grid layer and feature Layer in mapbox map?

I have created polygon using two way but i have not understand difference between them. using grid layer http://bl.ocks.org/rclark/7043524 using feature layer...... L.mapbox.accessToken = 'pk....
3
votes
1answer
3k views

Extract geojson 'properties' dynamically with mapbox gl

I have an interactive map based on MapBox WebGL. I have an 'on click' function which is returning all information on data layers at that location (lovely). For each object I am trying to pull out ...
3
votes
1answer
195 views

Mapbox - Icon rotations in FeatureCollection

I'm displaying various ships on a map and I have made real sized polygons to represent them. These are not visible at lower zooms, so I wanted to also add icons representing each ship. The icon is a ...
3
votes
1answer
363 views

Turfjs default es6 import fails

I'm trying to use Turf distance and Turf point with Mapbox GL JS. I've installed @turf/distance from npm which also installs @turf/helpers. I see that distance has a default export exports.default =...
3
votes
1answer
2k views

Get properties data from MapBox vector tile source

I struggle with getting data from a MapBox Vector Tile source or MapBox DataSet. I found the example page from MapBox GL JS. The goal is to let users put in a number (1-24) in a input field, this ...
3
votes
1answer
3k views

Using mapbox gl js offline?

Im just wanting to understand my options for producing an offline map using Mapbox gl js. I have investigated several option with little signs of progress. First, I have tried using Studio by ...
3
votes
0answers
281 views

Converting XYZ tile coordinate to WMTS

I would like to add a WMTS tile endpoint to Mapbox-GL-JS, which only supports "XYZ" or TMS tiling schemes. According to what I understand of the WMTS specification the two seem to have the same zoom ...
3
votes
1answer
339 views

Reduce geojson/wkt source data density

I have administrative boundary data in geojson/wkt format, which I retrieve from my REST service and display, using mapbox gl. This works well enough, but the data points are (depending on the country)...
3
votes
0answers
240 views

Supercluster and vector tiles

I am trying to take a set of points, use supercluster to create an index, and query that index for vector tiles. Things mostly work as expected, but when the tiles are loaded into Mapbox GL JS they ...
3
votes
0answers
386 views

Maintaining Curves in Mapbox-GL

I am trying out Mapbox-gl-js as an alternative to our current openLayers 3 solution. This is primarily due to a desire to shift away from raster backgrounds and to utilize the webGL and vector tile ...
3
votes
0answers
997 views

rotate custom icon on mapbox gl js

I try to rotate a custom Marker icon inside Mapbox gl-js. All the commented attempts not working. Are we absolutely need to go with geojson sources to rotate an icon and a custom one that is not able ...
3
votes
0answers
466 views

Data-driven styling in Mapbox GL JS - Error when drawing circle radius by zoom level and property

I'm playing around with data-driven styling in Mapbox GL JS. Setting the circle color based on a layer property works just fine: "circle-color": { 'property': 'mag', 'stops': [ [4, ...
2
votes
2answers
2k views

How to add links to popups in Mapbox GL JS

I have managed to make a map w/ styled pops and such. However, what I am trying to do now is to have it such that the links inside of the popups connect directly to websites. If possible, I would like ...
2
votes
1answer
492 views

Turf Envelope returns 5 array coordinates for rectangle polygon

I'm trying to understand why turf.envelope() returns 5 coordinate arrays. I'd expect to see only 4. Is this normal/expected behavior? I ask because I'm currently trying to debug an issue I'm having ...
2
votes
1answer
430 views

Can I use a browser's developer tools to see the zoom level of current map in browser?

What I'm looking for Where a map is being served by Mapbox in my browser is there anywhere within the Chrome/Firefox Developer Tools where it shows the current zoom level as displayed on screen? ...
2
votes
1answer
803 views

Mapbox.js (or GL) with OpenLayers

Our initial need is to have a GIS tool that overlays images on a map which is not facing north. In our research we have seen that only Mapbox and OpenLayers support this. Along with that we want ...
2
votes
1answer
7k views

How to add CSS styling in Mapbox GL Popup?

I am aware this is similar to many other questions, but I have been unable to determine how to add the correct code to style my popups in mapbox-gl. I'm very new to CSS, Mapbox-gl, and coding in ...
2
votes
2answers
497 views

Mapbox-GL-JS styles that use Mapzen's vector tiles

Are there any complete, public, styles in Mapbox-GL/JS format that use Mapzen's vector tiles? The only one I can find is Mapzen's own effort but it doesn't look like much effort has gone into it, it's ...
2
votes
1answer
1k views

GeoJSON in MapBox GL JS: Can I set layout and paint properties individually for each feature?

For example I have some GeoJSON here that represents airspace regions and they have in their properties "HIGHALT" in feet, so it would be very natural for me to map this to the fill-extrusion-height ...
2
votes
1answer
1k views

Get coordinates from drawn items with Mapbox-gl-draw

I'm using mapbox-gl-draw in my application and I need to get and save the coordinates of the drawn items on the map. I've checked and I found turf getCoor method, but I don't know how to access the ...
2
votes
1answer
2k views

Mapbox GL JS - Zoom to linestring feature - fitbounds

I'm slowly trying to switch to geojson layers with Mapbox GL JS. I have few layers on my test map but I can't get the fitbounds to work. What I want to achieve is: Hoover over linestring highlights ...
2
votes
1answer
255 views

Spatial Query tool for Mapbox

I’ve using Mapbox Studio to create a web map that’ll allow a user to interact with some basic parcel data. I’m looking to add a basic spatial query tool for the user so that they can apply spatial ...
2
votes
0answers
32 views

Get position/rotation of free labels in QGIS

I want to export the position and rotation of labels with placement "Free" as I need them in Mapbox, which has inferior label placement compared to QGIS. I've tried with various polygon-to-point ...
2
votes
0answers
138 views

Extend / override Mapbox-gl 'baselayer' loadTile

Similar to how Leaflet's guide shows how to override L.TileLayer's getTileUrl method in place of your own (and L.GridLayer's createTile method), I want to know how to extend/override Mapbox-gl's ...
2
votes
0answers
315 views

Mapbox GL Expression to filter array in property

I have GeoJSON Feature properties that look like this: { "type": "FeatureCollection", "features": [ { "type": "Feature", "properties": { "id": "someID", "...
2
votes
0answers
302 views

Turf.js midpoint of line

I'd like to open a popup in on the midpoint of a polyline/linestring in Mapbox GL, like it's the default case in Leaflet. How can I do this via turf.js? If I use centroid/center/centerOfMass it will ...
2
votes
0answers
172 views

Is there a “Disperse Markers” option in Mapbox GL-JS?

I have used the "Disperse Markers" tool in ArcGIS before, but I am currently working on a project where I am using Mapbox GL-JS to display point data. Many of my points overlap, and I would like them ...