Skip to content

feat: Customizable line styles#361

Open
daniel-freiermuth wants to merge 5 commits into
SignalK:masterfrom
daniel-freiermuth:configurable-line-styles
Open

feat: Customizable line styles#361
daniel-freiermuth wants to merge 5 commits into
SignalK:masterfrom
daniel-freiermuth:configurable-line-styles

Conversation

@daniel-freiermuth

@daniel-freiermuth daniel-freiermuth commented Apr 10, 2026

Copy link
Copy Markdown
Contributor

This PR builts on top of #363

Depending on the background map and the screen and sunlight angle, the default line style can be hard to see. This PR proposes making the line and track styles customizable.

Heading in bright red, COG line thin dotted in black
Screenshot From 2026-04-18 14-22-50

Track style menu:
Screenshot From 2026-04-18 14-20-51

Vessel line style menu
Screenshot From 2026-04-18 14-19-54

@daniel-freiermuth daniel-freiermuth force-pushed the configurable-line-styles branch from c39fed2 to 3bcc53b Compare April 18, 2026 12:24
@daniel-freiermuth daniel-freiermuth changed the title [WIP] feat: Customizable line styles feat: Customizable line styles Apr 18, 2026
@daniel-freiermuth daniel-freiermuth force-pushed the configurable-line-styles branch from 3bcc53b to 1a2d8a5 Compare May 1, 2026 15:48
@panaaj

panaaj commented May 7, 2026

Copy link
Copy Markdown
Member

This PR contains a lot of change and is stacked on another PR.
#375 addresses the value propositon and implements a common line-style component and applies it to cog heading lines.
The remainder can be addressed in future as the Tracks API becomes a reality.

@daniel-freiermuth daniel-freiermuth force-pushed the configurable-line-styles branch from 1a2d8a5 to 7c7763f Compare May 9, 2026 07:04
@daniel-freiermuth

daniel-freiermuth commented May 9, 2026

Copy link
Copy Markdown
Contributor Author

Hi @panaaj,

Thanks for taking in some of the changes proposed in this PR. Given the partial integration and that the underlying PR #363 was already merged, I rebased and cleaned up the remaining changes:

  • fix: Use lookup table for dash style conversion The current dash-style parsing is fragile for longer dashes.
  • fix: Scale line pattern with width Fix that wide lines overbleed their pattern.
  • feat: Configurable route and navigation line styles This one is the most important one as the default linestyles are very hard to read with certain underlying charts and certain sunlight conditions.
  • feat: Flexible line length units for COG and heading lines What I consider a nice extension of customizable Heading and COG lines.
  • feat: Configurable self trail and AIS track line styles Adjustable styles for tracks. Not sure whether you want to take it in now and revert it later or just skip this commit.

Btw, you have editing rights on this PR in case you want to adapt it before merging.

The upstream formatLineDashArray() split the SVG string char-by-char, which
works for single-digit values but would break for any entry ≥ 10 (e.g.
'12 4' → [1, 2, 4] instead of [12, 4]).

Replace with a DASH_PATTERNS lookup table (exported from util.ts; might also be
moved somewhere else if better suited) that maps named patterns directly to
number arrays, removing the fragile parsing. lineDashMap in AppFacade now
derives SVG strings from the same table.

Also tightens LineStyleConfig.dash from string to LineStyleDash.
Otherwise, thick line segments bleed into the gaps
Add LineStyleConfig (color/weight/dash) for three route-related lines:
  - activeRoute    — the currently-navigated route (was hardcoded blue/4/solid)
  - activeSegment  — the active route leg (XTE reference track)
  - defaultRoute   — all other displayed routes   (was hardcoded green/2/dashed)
  - destination    — vessel-to-next-waypoint bearing line (was hardcoded orange/2/solid)
Replace the upstream plain \`length: number\` with \`lineLength: ILineLengthDef\`
supporting three unit kinds:
  - 'time'     — minutes at current SOG (original COG behaviour)
  - 'distance' — nautical miles (original heading behaviour)
  - 'pixels'   — fixed screen pixels at current map resolution
Add selfTrailStyle and aisTrackStyle settings (color, weight, dash pattern)
for the self vessel trail and AIS target tracks, using the existing
linestyle-select component.
@daniel-freiermuth daniel-freiermuth force-pushed the configurable-line-styles branch from 7c7763f to 3210ce5 Compare May 9, 2026 07:19
@joelkoz

joelkoz commented Jun 26, 2026

Copy link
Copy Markdown
Collaborator

Thanks for sticking with this, @daniel-freiermuth — and for rebasing onto #363 once it landed. The dash-style lookup table is a genuinely good catch: the old Array.from(...).map(Number) parse silently breaks on any multi-digit dash value, so that's a real fix, not just a refactor.

A few things before this can move, mostly about scope. Per the project's "one logical change per PR" guideline this is currently doing five distinct things at once, and two of them are bigger than the "line styles" framing suggests:

  • The length: numberlineLength: { kind, value } change rewrites a persisted config field and adds migration logic for two legacy formats in cleanConfig(). That's a user-data migration — if it's off, people lose their heading/COG line settings on upgrade. The repo runs vitest (ng test, co-located *.spec.ts), and cleanConfig() in app.config.ts is a clean seam for a regression test that exercises both legacy shapes. I'd want that covered before it merges.
  • Moving the self COG-line computation out of skstream.worker.ts into the main thread (drawVesselLines) is an architectural change with perf implications — a lot of boats run Freeboard headless on a Raspberry Pi or Cerbo GX. That deserves its own PR and its own discussion rather than riding along inside a styling change.

So my suggestion would be to split this into focused PRs:

  1. the dash lookup-table + width-scaling fixes — these stand alone cleanly and are the most obviously mergeable;
  2. configurable route/nav line styles — note this overlaps with Add line-style component  #375, so worth de-duping against what landed there;
  3. the flexible length units + the worker→main-thread move, as its own change.

The trail/AIS-track styling is the piece I'd hold until the Tracks API firms up, as @panaaj noted.

Two more things:

  • The description still reads "builds on top of fix: Use Rhumb Line instead of Great Circle for drawing cog and heading lines #363" (now merged) and predates the five-commit restructure — could you refresh the text to match the current commits? (And a quick check that the screenshots still reflect the current menus.)
  • One question on the route styling: routeFeatureStyles / destinationFeatureStyles are getters that build new OL Style objects on each access, and the route layer's effect() clears + re-parses on every input change. Does that re-parse all routes on every change-detection cycle? Just want to make sure it isn't thrashing on boats with a lot of routes.

Heads-up as well: we've got CodeRabbit running on the repo now, so when you open the split PRs you'll get an automated line-level review on each one too.

Thanks again — this is useful work; I just want it landing in pieces we can each review and revert independently.

@joelkoz joelkoz self-assigned this Jun 26, 2026
@joelkoz

joelkoz commented Jul 5, 2026

Copy link
Copy Markdown
Collaborator

@daniel-freiermuth Nudge. Is this something you want to pursue merging? Or would you like to close it?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants