Questions tagged [mapbox-gl-draw]

It is a Draw tools for mapbox-gl-js. Draw only works after the Mapbox GL JS map has loaded, so interact with Draw only after your map's load event.

53 questions
7
votes
1 answer

How to color individual polygons drawn with mapbox-gl draw?

I'm reading a GeoJSON file and importing the polygons (and other stuff) into mapbox-gl draw using draw.set(geoJSON). How do I color individual polygons by an attribute in the properties of a feature. Example: { "type": "FeatureCollection", …
Shravan
  • 73
  • 1
  • 4
7
votes
1 answer

How to drag a polygon in the same fashion as the dragging a point mapbox-gl-js example?

I have a geojson polygon adding to the map with the click of a button. I also have the style of the polygon changing on the mousedown event on the geojson and the x/y coord pairs (the geojson geometry) printing to the console accessing it through…
5
votes
2 answers

How to change line-dasharray settings in MapboxGL using user properties?

I tried to change the line-dasharray settings using the following code, 'line-dasharray': [ "case", ['==', ['get', "user_class_id"], 'laneway'],[0.2,2],[0.3,2] ] It gives this error, Error:…
5
votes
1 answer

Module not found: Error: Can't resolve 'fs' angular

I am implementing Mapbox in angular application and am doing as follows added css into angular-cli.json "../node_modules/@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css" Component import { Component } from '@angular/core'; import * as mapboxgl from…
VIK6Galado
  • 650
  • 14
  • 32
4
votes
1 answer

How to access control instances from map instance in Mapbox

I need a way to access a registered control instance from Mapbox map instance. For example, say I register a hypothetical Mapbox control: const control = new IControl(); // Where IControl is the hypothetical mapbox…
Tunmee
  • 2,483
  • 1
  • 7
  • 13
4
votes
1 answer

Draw a linear animated line between two markers in MapBox

I have seen few examples of animated line on mapbox but I haven't found any that creates a linear line between two points. I am able to create markers on the map and also to draw a line between these markers. But, I want to create that line slowly…
3
votes
0 answers

Draw bezier curves in mapbox-gl-js

I am looking for a way to draw bezier curves in my mapbox gl js app. Just like this very interesting example : https://demos.mapbox.com/bezier-drawing-tool/ Unfortunately i don't find any documentation about this demo and its exactly what i am…
JeffS
  • 41
  • 3
3
votes
0 answers

Mapbox show area on hover over drawn polygon

I am using the below code to add a custom control to draw the polygon on the map and show the area on the side(on a div) of the screen. change() { this.map.on('load', () => { this.draw = new MapboxDraw({ displayControlsDefault:…
Ayush Chauhan
  • 37
  • 1
  • 7
3
votes
1 answer

Allow drawing only one shape at a time with Mapbox-GL-Draw

I am using mapbox draw to draw a polygon. I would like it so that there can only be one drawn polygon on the screen at once. For example, the user draws a polygon and then clicks the polygon draw button again, the first polygon would be deleted. I…
blg2
  • 355
  • 6
  • 23
3
votes
1 answer

Using mapbox-gl and @mapbox/mapbox-gl-draw with webpack

I have trouble including mapbox-gl and @mapbox/mapbox-gl-draw in a webpack bundled app. I found that mapbox should be included with the dist version, so I required like that: require('mapbox-gl/dist/mapbox-gl.js') (same for Draw), and it works fine…
PhilippeAuriach
  • 2,418
  • 2
  • 22
  • 41
3
votes
2 answers

How to set position of mapbox-gl-draw control?

I'm using https://github.com/mapbox/mapbox-gl-draw for draw tools, and it by default sets the control position to the top right. Like so: It seems like it's possible to change the position of the control by setting an option, but I cannot figure…
Ben Rudolph
  • 2,509
  • 2
  • 19
  • 26
2
votes
2 answers

React forwardRef and callback ref, ref becomes undefined

This is not a Mapbox related issue, and you don’t need any map or related stuff knowledge to help. My issue is related to React refs. I’m using react-map-gl (Mapbox for React) with @mapbox/mapbox-gl-draw that allow user to draw geometries on the…
Joel
  • 974
  • 2
  • 10
  • 18
2
votes
1 answer

MapBoxGL Draw: Why is "FeatureTarget" of event undefined while I can see the value?

What I want to do is to access featureTarget property of a mouse event object returned from MapboxGL. My code is like this: // map is the instance of MapboxGL map.on('mousemove', e => { console.log("***"); console.log(e); …
Hassy
  • 73
  • 1
  • 5
2
votes
0 answers

How to keep mapbox-gl-draw features aligned with the perspective?

I am trying to draw rectangles in Mapbox that stay upright, while the map gets rotated (and are drawn upright, when the map is already rotated). I've used the following code to draw rectangles:…
ioeidos
  • 21
  • 2
2
votes
2 answers

How to import Mapbox GL Draw in Angular 8 project

I'm working on a Angular 8 project with Webpack. I was able to integrate Mapbox GL JS, but I don't know how to import Mabox GL Draw. I have following versions: "@angular/core": "8.2.14", "mapbox-gl": "^1.9.0", "@types/mapbox-gl":…
1
2 3 4