mapbox / mapbox/mapbox-gl-js

Dash line has a tail with` round`line cap

Open
#10,218 0 comments 0 reactions 1 assignee View on GitHub

@SnailBones is already working on this.

Since Jun 29, 2021.

bug :lady_beetle: good first issue
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

mapbox-gl-js version: v.1.x

Steps to Trigger Behavior

Use the following style, the rendered dash line has a redundant tail

{
"version": 8,
"metadata": {
  "test": {
    "width": 64,
    "height": 64
  }
},
"sources": {
  "geojson": {
    "type": "geojson",
    "data": {
      "type": "LineString",
      "coordinates": [
        [
          -10,
          0
        ],
        [
          10,
          0
        ]
      ]
    }
  }
},
"layers": [
  {
    "id": "line",
    "type": "line",
    "source": "geojson",
    "layout": {
      "line-cap": "round"
    },
    "paint": {
      "line-width": 8,
      "line-dasharray": [1, -2, -1, 1],
      "line-color": "blue"
    }
  }
]
}
Expected Behavior

dash line is rendered without tail.

Actual Behavior
Screen Shot 2020-08-28 at 9 47 53 PM

cc: @zmiao

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.