Appearance
Работа с аннотациями
Пример получения аннотаций
html
<div id="map" style="height: 600px;"></div>js
import { UMap } from '@umap/sdk';
const map = new UMap('#map', {
mapName: 'demo-map',
});
// Получение всех аннотаций
const allAnnotationsResult = await map.getAnnotations();
console.log(
'Все аннотации',
allAnnotationsResult.annotations.map(a => a.name),
);
// Получение аннотаций по id
const annotationsByIdResult = await map.getAnnotations({
ids: [
'ebbe3884-2afc-4123-ad0e-27472a5bf6f3',
'4aa6c677-ecae-4ef2-a67f-375a8b84fd0c',
],
});
console.log(
'Аннотации по id',
annotationsByIdResult.annotations.map(a => a.name),
);
// Получение аннотаций по externalKeys
const annotationsByExternalKeysResult = await map.getAnnotations({
externalKeys: ['key1', 'key2'],
});
console.log(
'Аннотации по externalKeys',
annotationsByExternalKeysResult.annotations.map(a => a.name),
);Пример фокуса камеры на выбранных аннотациях
html
<div id="map" style="height: 600px;"></div>js
import { UMap } from '@umap/sdk';
const map = new UMap('#map', {
mapName: 'demo-map',
});
map.on('annotationsSelected', async ({ annotations }) => {
const ids = annotations.map(a => a.id);
await map.focusOnAnnotations({
ids,
animated: true,
});
});