ui_locations_entries_pin.mjs
/**
## ui/locations/entries/pin
The pin entry module exports the pin method as mapp.ui.locations.entries.pin()
@module /ui/locations/entries/pin
*/
mapp.utils.merge(mapp.dictionaries, {
'en': {
pin: 'Pin',
},
'de': {
pin: 'Pin',
},
'zh': {
pin: '标注',
},
'zh_tw': {
pin: '標注',
},
'pl': {
pin: 'Oznacz',
},
'fr': {
pin: 'Marquer',
},
'ja': {
pin: 'ピン',
},
'esp': {
pin: 'Marcar',
},
'tr': {
pin: 'Sabitle',
},
'it': {
pin: 'Pin'
},
'th': {
pin: 'เข็มหมุด',
},
})
/**
@function pin
@description
Places a pin on the selected location on the map. A checkbox is supplied to turn the pin on and off.
The pin will be styled by the entry.style property if provided. Otherwise the location.pinStyle assigned by the locations [listview]{@link module:/ui/locations/listview~listview} method will be used. A location may not have a pinStyle if no listview has been configured for the mapview.
@param {infoj-entry} entry type:pin entry.
@property {location} entry.location The entry location.
@property {array} entry.value An array containing entrys' co-ordinates.
@property {string} [entry.label] Label for checkbox element.
@property {boolean} [entry.display] The pin display flag.
@property {string} [entry.srid] The srid of the pin.
@property {integer} [entry.zIndex] The html layer on which the pin should display.
@property {object} [entry.style] Style properties of the pin which may include a scale.
@return {HTMLElement} Location pin and display checkbox.
*/
export default function pin(entry) {
if (!Array.isArray(entry.value)) {
console.warn(`Entry type pin requires a value array.`)
return;
}
// Assign srid from location.layer if not implicit.
entry.srid ??= entry.location.layer.srid
// Remove existing pin layer
entry.location.layer.mapview.Map.removeLayer(entry.L)
entry.zIndex ??= Infinity
entry.Style ??= entry.style ? mapp.utils.style(entry.style): entry.location.pinStyle
entry.srid ??= entry.location.layer.srid
entry.geometry = {
type: 'Point',
coordinates: entry.value,
}
if (entry.L) {
entry.location.layer.mapview.Map.removeLayer(entry.L)
// Layer object must be filtered from the Layers array before being deleted.
entry.location.Layers = entry.location.Layers.filter(L => L.ol_uid !== entry.L.ol_uid)
delete entry.L
}
entry.L = entry.location.layer.mapview.geoJSON(entry)
entry.location.layer.display && entry.location.layer.L?.changed()
entry.location.Layers.push(entry.L)
const chkbox = mapp.ui.elements.chkbox({
label: `${entry.label || mapp.dictionary.pin}`,
checked: true,
onchange: (checked) => {
entry.display = checked
checked ?
entry.location.layer.mapview.Map.addLayer(entry.L) :
entry.location.layer.mapview.Map.removeLayer(entry.L);
}
})
const node = mapp.utils.html.node`${chkbox}`
return node
}