Skip to content

Создание стандартного маркера

html
<yandex-map
    :height="height"
    :settings="{
        location: LOCATION,
        theme,
        showScaleInCopyrights: true,
    }"
    :width="width"
>
    <yandex-map-default-scheme-layer/>
    <yandex-map-default-features-layer/>
    <yandex-map-default-marker
        v-for="marker in markersGeoJsonSource"
        :key="marker.title"
        :settings="marker"
    />
</yandex-map>
ts
import {
    YandexMap,
    YandexMapDefaultFeaturesLayer,
    YandexMapDefaultMarker,
    YandexMapDefaultSchemeLayer,
} from 'vue-yandex-maps';
import type { LngLat } from '@yandex/ymaps3-types';
import type { YMapLocationRequest } from '@yandex/ymaps3-types/imperative/YMap';

const LOCATION: YMapLocationRequest = {
    center: [18.54, 39.26], // starting position [lng, lat]
    zoom: 2, // starting zoom
};

// Array containing GeoJSON data for markers
const markersGeoJsonSource = [
    {
        coordinates: [-100.3, 50.5] as LngLat,
        title: 'North America',
        subtitle: 'Greenland is the Largest Island <br> in North America and the World',
        color: '#00CC00',
    },
    {
        coordinates: [-60.3, -10.5] as LngLat,
        title: 'South America',
        subtitle: `The Andes are the world's <br> longest continental <br> mountain range`,
        color: '#008001',
    },
    {
        coordinates: [25.5, 12.5] as LngLat,
        title: 'Africa',
        subtitle: `It is home to the world's <br> longest river, The Nile`,
        color: '#FF2400',
    },
    {
        coordinates: [88.5, 50.6] as LngLat,
        color: '#FDD52E',
        title: 'Asia',
        subtitle: 'Asia has the highest <br> mountain in the world is Everest',
    },
    {
        coordinates: [22.2, 52.9] as LngLat,
        color: '#01BBEA',
        title: 'Europe',
        subtitle: `Europe has the world's smallest <br> country, the Vatican City`,
    },
    {
        coordinates: [135.5, -25.5] as LngLat,
        color: '#627BC1',
        title: 'Australia',
        subtitle: `80% of the animals <br> are unique to Australia`,
    },
    {
        coordinates: [25.5, -79.5] as LngLat,
        color: '#999999',
        title: 'Antarctica',
        subtitle: `Ice covers roughly 98% <br> of Antarctica, which equates <br> to 90% of the Earth's ice <br> and 70% of our fresh water`,
    },
];

Сделано с ♥ под лицензией MIT.