# j-DrawZone

> Съставът може да рисува зона (полигон). [Отворени](https://openlayers.org/) Библиотеката с [OpenStreetMap](https://www.openstreetmap.org/) Карта на двигателя.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: bg
Content-SHA256: 37b31523a12782743c3745cefd8e3b395578a34a1693e2203b02b03c42aa9be2
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Съставът може да рисува зона (полигон). [Отворени](https://openlayers.org/) Библиотеката с [OpenStreetMap](https://www.openstreetmap.org/) Карта на двигателя.


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

- `parent {String}` е родителски елемент (дефолт: `undefined`)
- `height {Number}` Минимална височина (дефинирана) `200`)
- `color {String}` е стандартна цвят за полигон (дефолт: `#fcba03`)
- `zoom {Number}` е стандартно ниво на зом (предварително: `11`)
- `readonly {Boolean}` позволява readonly режим (предварително: `false`)
- `stroke {Number}` Разширяване на ширината (предварително: `2`)
- `radius {Number}` - радиус размер на точките в полигона (предварително: `7`)
- `center {String}` Позиция на картата (по подразбиране: `48.73702478789267,19.137712002562715`)
- `opacity {Number}` определя прозрачността на полигона в процент (дефолт: `40`)
- `required {Boolean}` опционално (предварително: `false`)
- `filter {String}` опционален, CSS филтър например `filter:grayscale(90%) invert(100%)` (предварително: `null`)
- __NEW__: `exec {String}` опция, връзка към `function(value, component)` (това ще бъде изпълнено, когато стойността се променя)

__Data-Source__ трябва да съдържа:

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

__Методи__:

- `component.clear([draw])` почиства полигона `@draw {Boolean}` (предварително: `false`)
- `component.move(lat, lng)` премества картата към конкретната позиция
- `component.export(opt, callback(base64))` експортира данни в снимката
    - `opt.width {Number}` Необходими
    - `opt.height {Number}` Необходими
    - `opt.zoom {Number}` (Съгласно с дефолт `13`)
    - `opt.type {png|jpg}` (Съгласно с дефолт `png`)
    - `opt.quality {Number}` само за JPEG
    - `opt.points {Array Number}`
    - `opt.color {String}` (Съгласно с дефолт `config.color`)
    - `opt.radius {Number}` (Съгласно с дефолт `config.radius`)
    - `opt.opacity {Number}` (Съгласно с дефолт `config.opacity`)

__Изходът__:

- Разширено от `center { lat: Number, lng: Number }` имоти

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

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

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

```html example.html
<style>
	body { margin: 0; padding: 0; }
</style>

<ui-component name="drawzone" path="map" config="parent:window;color:#FD391A;geolocation:0"></ui-component>

<script>
	var map = { 
		points: []
	};
</script>
```