almet/umap
1
0
Fork 0
mirror of https://github.com/umap-project/umap.git synced 2025-04-29 11:52:38 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

wip: refine geodatamine importer

Browse source
This commit is contained in:
Yohan Boniface 2024-06-11 10:40:25 +02:00
parent f1901ea84c
commit 2c9623aff6
2 changed files with 22 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
umap/static/umap/base.css
View file

@ -315,6 +315,9 @@ label {
line-height: 21px; line-height: 21px;
width: 100%; width: 100%;
} }
label + label {
margin-top: var(--box-space);
}
.content label { .content label {
font-weight: bold; font-weight: bold;
} }

26
umap/static/umap/js/modules/importers/geodatamine.js
View file

@ -1,4 +1,4 @@
import { DomUtil } from '../../../vendors/leaflet/leaflet-src.esm.js' import { DomUtil, DomEvent } from '../../../vendors/leaflet/leaflet-src.esm.js'
import { BaseAjax, SingleMixin } from '../autocomplete.js' import { BaseAjax, SingleMixin } from '../autocomplete.js'
import { translate } from '../i18n.js' import { translate } from '../i18n.js'
@ -13,11 +13,17 @@ const BOUNDARY_TYPES = {
const TEMPLATE = ` const TEMPLATE = `
<h3>GeoDataMine</h3> <h3>GeoDataMine</h3>
<select name="theme"></select> <p>${translate('GeoDataMine: thematic data from OpenStreetMap')}.</p>
<select name="theme">
<option value="">${translate('Choose a theme')}</option>
</select>
<label> <label>
<input type="checkbox" name="aspoint" /> <input type="checkbox" name="aspoint" />
${translate('Convert all geometries to points')} ${translate('Symplify all geometries to points')}
</label> </label>
<label id="boundary">
</label>
<button class="button">${translate('Choose this data')}</button>
` `
class Autocomplete extends SingleMixin(BaseAjax) { class Autocomplete extends SingleMixin(BaseAjax) {
@ -30,8 +36,9 @@ class Autocomplete extends SingleMixin(BaseAjax) {
} }
export class Importer { export class Importer {
constructor(map, options) { constructor(map, options = {}) {
this.name = 'GeoDataMine' this.map = map
this.name = options.name || 'GeoDataMine'
this.baseUrl = options?.url || 'https://geodatamine.fr' this.baseUrl = options?.url || 'https://geodatamine.fr'
} }
@ -56,7 +63,8 @@ export class Importer {
console.error(response) console.error(response)
} }
const asPoint = container.querySelector('[name=aspoint]') const asPoint = container.querySelector('[name=aspoint]')
this.autocomplete = new Autocomplete(container, { this.autocomplete = new Autocomplete(container.querySelector('#boundary'), {
placeholder: translate('Search admin boundary'),
url: `${this.baseUrl}/boundaries/search?text={q}`, url: `${this.baseUrl}/boundaries/search?text={q}`,
on_select: (choice) => { on_select: (choice) => {
boundary = choice.item.value boundary = choice.item.value
@ -64,12 +72,16 @@ export class Importer {
}, },
}) })
const confirm = () => { const confirm = () => {
if (!boundary || !select.value) {
this.map.alert.open({content: translate('Please choose a theme and a boundary first.')})
return
}
importer.url = `${this.baseUrl}/data/${select.value}/${boundary}?format=geojson&aspoint=${asPoint.checked}` importer.url = `${this.baseUrl}/data/${select.value}/${boundary}?format=geojson&aspoint=${asPoint.checked}`
importer.format = 'geojson' importer.format = 'geojson'
importer.layerName = `${boundaryName} — ${select.options[select.selectedIndex].textContent}` importer.layerName = `${boundaryName} — ${select.options[select.selectedIndex].textContent}`
importer.dialog.close() importer.dialog.close()
} }
L.DomUtil.createButton('', container, 'OK', confirm) DomEvent.on(container.querySelector('button'), 'click', confirm)
importer.dialog.open({ importer.dialog.open({
content: container, content: container,