JSFiddle - React, Tailwind, and code Playground
by atach
HTML
<script src="<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>"></script>
<script src="http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
<div id="map" style="width:800px; height:600px"></div>
JavaScript
ymaps.ready(init);
function init() {
var myMap = new ymaps.Map("map", {
center: [55.73, 37.75],
zoom: 10
});
// Создаем многоугольник, используя класс GeoObject.
var myGeoObject = new ymaps.GeoObject({
// Описываем геометрию геообъекта.
geometry: {
// Тип геометрии - "Многоугольник".
type: "Polygon",
// Указываем координаты вершин многоугольника.
coordinates: [
// Координаты вершин внешнего контура.
[
[55.768157, 37.838771],
[55.770479, 38.037898],
[55.695315, 37.840144],
[55.68911, 38.040645]
]
],
// Задаем правило заливки внутренних контуров по алгоритму "nonZero".
fillRule: "nonZero"
},
// Описываем свойства геообъекта.
properties:{
// Содержимое балуна.
balloonContent: "Многоугольник"
}
}, {
// Описываем опции геообъекта.
// Цвет заливки.
fillColor: '#00FF00',
// Цвет обводки.
strokeColor: '#0000FF',
// Общая прозрачность (как для заливки, так и для обводки).
opacity: 0.5,
// Ширина обводки.
strokeWidth: 5,
// Стиль обводки.
strokeStyle: 'shortdash'
});
// Добавляем многоугольник на карту.
myMap.geoObjects.add(myGeoObject);
// Создаем многоугольник, используя вспомогательный класс Polygon.
var myPolygon = new ymaps.Polygon([
// Указываем координаты вершин многоугольника.
// Координаты вершин внешнего контура.
[
[55.754219, 37.507808],
[55.754994, 37.694575],
[55.696867, 37.701442],
[55.703847, 37.55038]
]
], {
// Описываем свойства геообъекта.
// Содержимое балуна.
hintContent: "Многоугольник"
}, {
// Задаем опции геообъекта.
//...