j-MapZones

jComponent 20 · jcomponent@20 component Примерът е зареден с jComponent 20

Съставът за рисуване и показване на зоните на картата. Отворени Библиотеката с OpenStreetMap Машината използва зависимост от трета страна.

Конфигуриране:

Фиксирана височина на height {Number/String} или родителски елемент (предварително: 200)
color {String} позволява персонализиране на цветовете за създаден полигон (предварително: #fcba03)
zoom {Number} е стандартно ниво на зом (предварително: 11)
modify {Boolean} позволява модификация на полигона (предварително: true)
opacity {Number} определя прозрачността на полигона в процент (дефолт: 20)
NEW exec {String} връзка към function(value), тя се изпълнява, когато стойността се променя

Data-Source трябва да съдържа:

{
    points: [{ lat: 48.75152530164132, lng: 19.13902142954625 }, { lat: 48.726826662905296, lng: 19.123238694044034 }, ...] // polygon points
    color: '#FD391A', // optional
    zoom: 13 // optional
}

Добре е да се знае:

SHIFT + click на върховете (създадена точка) ще изтрие избраната точка

Използвайте го с <ui-component name="mapzones">Когато компонентът все още не е зареден, jComponent Изтегляне на първия адрес в DEF.fallback (След това Componentator CDN по подразбиране). Автор: Додо Мартон / Питър Ширка. източник: Componentator Съставни съставки, лиценз на MIT.

example.html

<div style="width:400px">
	<ui-component name="mapzones" path="map" config="height:400;color:#FD391A"></ui-component>
</div>

<script>
	var map = { 
		points: [
			{ lat: 48.75152530164132, lng: 19.13902142954625 },
			{ lat: 48.726826662905296, lng: 19.123238694044034 },
			{ lat: 48.739833820262106, lng: 19.190119425971947 },
			{ lat: 48.75152530164132, lng: 19.13902142954625 }
		],
		color: '#FD391A',
		zoom: 13 
	};
</script>