Behavior of line-cap + line-dasharray

[nickidlugash]

Currently, line caps do not control the caps of line segments in lines using line-dasharray. They do in carto, and I think they should in GL, too.

In carto:

In mapbox-gl-js:

  {
    "id": "BicycleLane",
    "type": "line",
    "source": "Bike Lanes DC",
    "source-layer": "BicycleLane",
    "layout": {
      "line-cap": "round",
      "line-join": "round"
    },
    "paint": {
      "line-color": "#942192",
      "line-width": "6",
     "line-dasharray": [6, 2]
    }
  }

[peterqliu]

What would happen if the dash were shorter than the radius of the cap?
Long dashes would look fine as "( )", but they'd become this fish-shaped wedge when short "()"

[jfirebaugh]

This is part of #649.

[nickidlugash]

@jfirebaugh awesome – really looking forward to all those dasharray improvements being merged in.

What would happen if the dash were shorter than the radius of the cap?

@peterqliu I'm not sure how @ansis implemented this, but in most styling programs, the dash shape tends to a perfect circle as the dash length tends to 0, since at 0, the two semi-circle caps join up to form a circle. Carto does this too, although it doesn't seem to actually render a value of 0 (but you could do 0.01).

[peterqliu]

the two semi-circle caps join up to form a circle

@nickidlugash this is interesting, because that would mean the length of a dash is really the dash, plus two end caps. Since a round cap gets longer as you thicken a stroke, that means each dash gets slightly longer as the line gets thicker?

[nickidlugash]

@nickidlugash this is interesting, because that would mean the length of a dash is really the dash, plus two end caps. Since a round cap gets longer as you thicken a stroke, that means each dash gets slightly longer as the line gets thicker?

y, it should. In the PR linked above, the line-dasharray values will be scale factors of the line-width, so the dash array should stay proportional.

[ansis]

done in #938