Skip to content
Docs version
@hungpvq/vue-map@1.2.0@hungpvq/vue-map-core@1.2.0@hungpvq/vue-map-dataset@1.2.0@hungpvq/vue-map-draw@1.2.0@hungpvq/map-draw@1.2.0@hungpvq/react-map@1.2.0@hungpvq/react-map-core@1.2.0@hungpvq/react-map-dataset@1.2.0@hungpvq/react-map-draw@1.2.0

Layer ​

MapLibre paint layers. Pair with a source on the same parent.

Events: none (visibility / opacity go through the list UI).

Factory ​

ts
createMultiMapboxLayerComponent(name: string, layers?: BaseLayerSpec[])

BaseLayerSpec is a MapLibre LayerSpecification without a required id (an id is assigned if missing).

ts
import { createMultiMapboxLayerComponent } from '@hungpvq/map-dataset';
import { LayerSimpleMapboxBuild } from '@hungpvq/map-dataset/style';

const layer = createMultiMapboxLayerComponent('cities', [new LayerSimpleMapboxBuild().setStyleType('point').setColor('#ff6b6b').build()]);

const multi = createMultiMapboxLayerComponent('mixed', [new LayerSimpleMapboxBuild().setStyleType('point').setColor('#ff6b6b').build(), new LayerSimpleMapboxBuild().setStyleType('line').setColor('#4ecdc4').build()]);

Or pass a raw spec:

ts
createMultiMapboxLayerComponent('fill', [
  {
    type: 'fill',
    paint: { 'fill-color': '#4ecdc4', 'fill-opacity': 0.4 },
  },
]);

Methods on the node: getAllLayerIds(), getLayers(), moveLayer(map, beforeId), updateValue(map, value).

Style editor from the list ⋮ menu uses getComponentUpdate() → registry key style-control. Mount ComponentManagementControl so that dialog can open.

See LayerSimpleMapboxBuild for point / line / area / symbol.