feat: support custom HTML/SVG element markers in MapLibre
Add Element, Anchor, and Rotation fields to the Marker struct so users can render custom icons (ships, circles, buildings) instead of the default pin. When Element is set, Color is ignored and the raw HTML/SVG is injected as the marker's DOM element. Update the example to demonstrate a static ship SVG marker with rotation and a signal-driven vehicle marker using a custom SVG circle.
This commit is contained in:
@@ -179,10 +179,25 @@ func initScript(m *Map) string {
|
||||
// markerBodyJS generates JS to add a marker, assuming `map` is in scope.
|
||||
func markerBodyJS(mapID, markerID string, mk Marker) string {
|
||||
var b strings.Builder
|
||||
|
||||
if mk.Element != "" {
|
||||
b.WriteString(fmt.Sprintf(
|
||||
`var _mkEl=document.createElement('div');_mkEl.innerHTML=%s;`,
|
||||
jsonStr(mk.Element)))
|
||||
}
|
||||
|
||||
opts := "{"
|
||||
if mk.Color != "" {
|
||||
if mk.Element != "" {
|
||||
opts += `element:_mkEl.firstElementChild||_mkEl,`
|
||||
} else if mk.Color != "" {
|
||||
opts += fmt.Sprintf(`color:%s,`, jsonStr(mk.Color))
|
||||
}
|
||||
if mk.Anchor != "" {
|
||||
opts += fmt.Sprintf(`anchor:%s,`, jsonStr(mk.Anchor))
|
||||
}
|
||||
if mk.Rotation != 0 {
|
||||
opts += fmt.Sprintf(`rotation:%s,`, formatFloat(mk.Rotation))
|
||||
}
|
||||
if mk.Draggable {
|
||||
opts += `draggable:true,`
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user