Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

210
Views
How do I hide the undrawn side of a polygon during draw mode of polygon using mapbox-gl-draw?

The normal function of the polygon draw tool of mapbox-gl-draw, shows the polygon that would be created if you clicked the original point from where you started.

enter image description here

But what I would like is to NOT show the line that hasn't yet been drawn by the user during draw mode.

In this image, the left side and the bottom side are fine because the user placed the top point and the second point at the bottom. But I do not want to see line connecting where my cursor is to the original point.

I am able to remove the fill color by changing the fill styling but I am unable to hide the "ghost" line as it uses the same stroke as the other user-drawn lines.

I have used the section "Lines and polygons" from this link: https://github.com/mapbox/mapbox-gl-draw/blob/main/docs/EXAMPLES.md

What I have tried to edit:

{
    id: "gl-draw-polygon-stroke-active",
    type: "line",
    filter: ["all", ["==", "$type", "Polygon"], ["!=", "mode", "static"]],
    layout: {
      "line-cap": "round",
      "line-join": "round",
    },
    paint: {
      "line-color": "#D20C0C",
      "line-dasharray": [0.2, 2],
      "line-width": 3,
    },
  }

But this changes the stroke of the "ghost" line as well. Is it possible to just hide the ghost line or do I need to make a custom polygon implementation of mapbox-gl-draw polygon mode?

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!