dawarich/app/javascript/maps_maplibre/layers/points_layer.js

import { BaseLayer } from './base_layer'

/**
 * Points layer for displaying individual location points
 */
export class PointsLayer extends BaseLayer {
  constructor(map, options = {}) {
    super(map, { id: 'points', ...options })
  }

  getSourceConfig() {
    return {
      type: 'geojson',
      data: this.data || {
        type: 'FeatureCollection',
        features: []
      }
    }
  }

  getLayerConfigs() {
    return [
      // Individual points
      {
        id: this.id,
        type: 'circle',
        source: this.sourceId,
        paint: {
          'circle-color': '#3b82f6',
          'circle-radius': 6,
          'circle-stroke-width': 2,
          'circle-stroke-color': '#ffffff'
        }
      }
    ]
  }
}