j-DrawZone

jComponent 20 · jcomponent@20 component Příklad načten s jComponent 20

Komponenta může vytvářet zónu (polygon). OpenLayers Knihovna s OpenStreetMap Mapové motory

Konfigurace:

parent {String} je prvek rodiče (předvolený: undefined)
height {Number} pevná (minimální) výška (předvolená: 200)
Standardní barva pro polygon color {String} (předvolený: #fcba03)
zoom {Number} Standardní zoomová úroveň (default zoom level): 11)
readonly {Boolean} umožňuje readonly režim (default: false)
stroke {Number} šířka nárazu (předběžné: 2)
radius {Number} - rozměr rádio bodů v polygonu (předběžně: 7)
center {String} Standardní poloha mapy (default) 48.73702478789267,19.137712002562715)
opacity {Number} určuje transparentnost polygonu v procentech (default: 40)
required {Boolean} volitelné (předvolené: false)
filter {String} volitelný, CSS filtr např. filter:grayscale(90%) invert(100%) (předvolený: null)
NEW: exec {String} volitelné, odkaz na function(value, component) (bude spuštěn při změně hodnoty)

Data-source musí obsahovat:

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

Metody:

component.clear([draw]) čistí polygon @draw {Boolean} (předvolený: false)
component.move(lat, lng) přemístí mapu do konkrétní polohy
component.export(opt, callback(base64)) exportuje data do obrazu
- opt.width {Number} požadované
- opt.height {Number} požadované
- opt.zoom {Number} (předvolené číslo: 13)
- opt.type {png|jpg} (předvolené číslo: png)
- opt.quality {Number} pouze pro JPEG
- opt.points {Array Number}
- opt.color {String} (předvolené číslo: config.color)
- opt.radius {Number} (předvolené číslo: config.radius)
- opt.opacity {Number} (předvolené číslo: config.opacity)

Výstup:

Vlastnictví se rozšiřuje na center { lat: Number, lng: Number }

Dobré vědět:

double click na vrstvách (stvořené body) odstraní vybrané body

Použijte ji s <ui-component name="drawzone">Pokud je součástka ještě nezačleněna, jComponent Stáhnout ji na první použití z adresy DEF.fallback a) The Componentator Autor: Peter Sirka a Dodo Marton. zdroj: Componentator Výrobce je autorizován, MIT licence.

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>