diff --git a/api-idee-js/src/facade/assets/images/girar-vista.svg b/api-idee-js/src/facade/assets/images/girar-vista.svg deleted file mode 100644 index 0484e6e7a..000000000 --- a/api-idee-js/src/facade/assets/images/girar-vista.svg +++ /dev/null @@ -1,106 +0,0 @@ - - - - \ No newline at end of file diff --git a/api-idee-js/src/facade/assets/images/inclinar-vista.svg b/api-idee-js/src/facade/assets/images/inclinar-vista.svg deleted file mode 100644 index e5c7988f4..000000000 --- a/api-idee-js/src/facade/assets/images/inclinar-vista.svg +++ /dev/null @@ -1,106 +0,0 @@ - - - - \ No newline at end of file diff --git a/api-idee-js/src/facade/js/i18n/en.json b/api-idee-js/src/facade/js/i18n/en.json index bd137cf0b..5035f996c 100644 --- a/api-idee-js/src/facade/js/i18n/en.json +++ b/api-idee-js/src/facade/js/i18n/en.json @@ -290,6 +290,7 @@ "getprojection_method": "The implementation used does not have the getProjection method.", "no_projection": "You have not specified any projection.", "setprojection_method": "The used implementation does not have the setProjection method.", + "no_valid_projection": "The following EPSG code is incorrect or does not exist", "no_plugins": "You have not specified any plugins.", "no_add_plugin_to_map": "The plugin can not be added to the map.", "plugin_already_added": "The plugin is already added to the map.", diff --git a/api-idee-js/src/facade/js/i18n/es.json b/api-idee-js/src/facade/js/i18n/es.json index c1cc5d8c1..66aa29605 100644 --- a/api-idee-js/src/facade/js/i18n/es.json +++ b/api-idee-js/src/facade/js/i18n/es.json @@ -291,6 +291,7 @@ "getprojection_method": "La implementación usada no posee el método getProjection.", "no_projection": "No ha especificado ninguna proyección.", "setprojection_method": "La implementación usada no posee el método setProjection.", + "no_valid_projection": "El siguiente código EPSG es erróneo o no existe", "no_plugins": "No ha especificado ningún plugin.", "no_add_plugin_to_map": "El plugin no puede añadirse al mapa.", "plugin_already_added": "El plugin ya está añadido al mapa.", diff --git a/api-idee-js/src/impl/ol/js/projections.js b/api-idee-js/src/impl/ol/js/projections.js index e3c3f9175..3268e45f0 100644 --- a/api-idee-js/src/impl/ol/js/projections.js +++ b/api-idee-js/src/impl/ol/js/projections.js @@ -6,6 +6,8 @@ import proj4 from 'proj4'; import OLProjection from 'ol/proj/Projection'; import { register } from 'ol/proj/proj4'; import { addEquivalentProjections, get as getProj } from 'ol/proj'; +import { getValue } from 'IDEE/i18n/language'; +import Exception from 'IDEE/exception/exception'; import { parseCRSWKTtoJSON } from '../../../facade/js/util/Utils'; /** @@ -665,7 +667,7 @@ const refactorUnits = (units) => { const getDefProjection = async (code) => { const response = await fetch(`https://epsg.io/${code}.proj4`); if (!response.ok) { - throw new Error(`EPSG code ${code} not found`); + Exception(`${getValue('exception').no_valid_projection}: ${code}`); } return response.text(); }; @@ -691,7 +693,7 @@ const setNewProjection = async (projection) => { const response = await fetch(url); if (!response.ok) { - throw new Error(`No se pudo obtener la definición WKT de EPSG:${code}`); + Exception(`${getValue('exception').no_valid_projection}: ${code}`); } const wktResponse = await response.text(); @@ -740,8 +742,6 @@ addProjections(projections, false); * @api stable */ export default { - addProjections, getSupportedProjs, - setNewProjection, ensureProjection, }; diff --git a/api-idee-js/src/plugins/infocoordinates/README.md b/api-idee-js/src/plugins/infocoordinates/README.md index fb1f36e53..1268205f8 100644 --- a/api-idee-js/src/plugins/infocoordinates/README.md +++ b/api-idee-js/src/plugins/infocoordinates/README.md @@ -54,11 +54,12 @@ El constructor se inicializa con un JSON con los siguientes atributos: - **decimalUTMcoord**: Indica el número de decimales de las coordenadas proyectadas en UTM. Por defecto: 2 - **helpUrl**: URL a la ayuda para el icono. Por defecto: 'https://www.ign.es/' - **outputDownloadFormat**: Indica el formato de salida del documento que se va a descargar. Se puede elegir entre 'txt' o 'csv'. Por defecto: txt. +- **epsgResults**: Códigos EPSG para mostrar simultáneamente las coordenadas, pero ocultará el selector CRS. Si es nulo se utilizará solamente la proyección usada en el mapa en ese momento y se habilitará el selector CRS. # API-REST ```javascript -URL_API?infocoordinates=position*collapsed*collapsible*tooltip*decimalGEOcoord*decimalUTMcoord*helpUrl*outputDownloadFormat +URL_API?infocoordinates=position*collapsed*collapsible*tooltip*decimalGEOcoord*decimalUTMcoord*helpUrl*outputDownloadFormat*epsgResults ``` @@ -112,6 +113,11 @@ URL_API?infocoordinates=position*collapsed*collapsible*tooltip*decimalGEOcoord*d + + + + +
txt/csv Base64 ✔️ | Separador ✔️
outputDownloadFormatArray de códigos EPSGBase64 ✔️ | Separador ❌
@@ -141,6 +147,7 @@ Ejemplo del constructor: decimalGEOcoord: 4, decimalUTMcoord: 4, helpUrl: "https://www.ign.es/", + epsgResults: [25831,4326,4258,3857], } ``` @@ -162,7 +169,8 @@ const mp = new IDEE.plugin.Infocoordinates({ order: 0, tooltip: 'Información coordenadas', decimalGEOcoord: 4, - decimalUTMcoord: 2 + decimalUTMcoord: 2, + epsgResults: [25831,4326,4258,3857], }); map.addPlugin(mp); diff --git a/api-idee-js/src/plugins/infocoordinates/src/api.json b/api-idee-js/src/plugins/infocoordinates/src/api.json index f88efd3c4..8870d030a 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/api.json +++ b/api-idee-js/src/plugins/infocoordinates/src/api.json @@ -47,6 +47,11 @@ "type": "simple", "name": "outputDownloadFormat", "position": 7 + }, + { + "type": "simple", + "name": "epsgResults", + "position": 8 } ] }], diff --git a/api-idee-js/src/plugins/infocoordinates/src/facade/assets/css/infocoordinates.css b/api-idee-js/src/plugins/infocoordinates/src/facade/assets/css/infocoordinates.css index 331b1cec6..f7cece0f8 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/facade/assets/css/infocoordinates.css +++ b/api-idee-js/src/plugins/infocoordinates/src/facade/assets/css/infocoordinates.css @@ -95,7 +95,7 @@ .grid-row--3col { display: grid; - grid-template-columns: 74px 74px 36px; + grid-template-columns: 74px 74px 40px; column-gap: 8px; align-items: center; } diff --git a/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/en.json b/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/en.json index 2c369bec6..fd7df5394 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/en.json +++ b/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/en.json @@ -2,7 +2,8 @@ "exception": { "impl": "The implementation used cannot create Infocoordinates controls.", "query_profile": "The altitude data for this point could not be queried.", - "srs": "The EPSG code entered is not valid. Default will be used: " + "srs": "The EPSG code entered is not valid. Default will be used: ", + "epsgResultsInvalid": "The following EPSG code for the 'epsgResults' parameter is invalid:" }, "textHelp": { "help1": "Click on the map to obtain the coordinates of a point in the selected reference system.", diff --git a/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/es.json b/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/es.json index e8ef9d1d1..fb9e2948a 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/es.json +++ b/api-idee-js/src/plugins/infocoordinates/src/facade/js/i18n/es.json @@ -2,7 +2,8 @@ "exception": { "impl": "La implementación no puede crear controles de Infocoordinates", "query_profile": "No se han podido consultar los datos de altitud para este punto.", - "srs": "El código EPSG introducido no es válido. Se usará por defecto: " + "srs": "El código EPSG introducido no es válido. Se usará por defecto: ", + "epsgResultsInvalid": "El siguiente código EPSG del parámetro 'epsgResults no es válido:" }, "textHelp": { "help1": "Haga clic en el mapa para obtener las coordenadas de un punto en el sistema de referencia seleccionado.", diff --git a/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinates.js b/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinates.js index ee74def99..999ad5633 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinates.js +++ b/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinates.js @@ -70,6 +70,21 @@ export default class Infocoordinates extends IDEE.Plugin { */ this.outputDownloadFormat_ = options.outputDownloadFormat || 'txt'; + /** + * EPSG codes to display simultaneously. Accepts "EPSG:4326" or "4326" format. + * When null, single-EPSG mode is used with the selector. + * @private + * @type {string[]|null} + */ + this.epsgResults_ = options.epsgResults + ? (Array.isArray(options.epsgResults) ? options.epsgResults : String(options.epsgResults).split(',')) + .map((code) => { + const str = String(code).trim(); + return str.startsWith('EPSG:') ? str : `EPSG:${str}`; + }) + .filter((code) => code !== 'EPSG:') + : null; + /** * Plugin parameters * @public @@ -136,6 +151,7 @@ export default class Infocoordinates extends IDEE.Plugin { helpUrl: this.helpUrl_, order: this.order, outputDownloadFormat: this.outputDownloadFormat_, + epsgResults: this.epsgResults_, }); this.controls.push(this.control_); @@ -186,7 +202,7 @@ export default class Infocoordinates extends IDEE.Plugin { * @api */ getAPIRest() { - return `${this.name}=${this.position}*${this.collapsed_}*${this.order}*${this.tooltip}*${this.decimalGEOcoord_}*${this.decimalUTMcoord_}*${this.helpUrl_}*${this.outputDownloadFormat_}`; + return `${this.name}=${this.position}*${this.collapsed_}*${this.order}*${this.tooltip}*${this.decimalGEOcoord_}*${this.decimalUTMcoord_}*${this.helpUrl_}*${this.outputDownloadFormat_}*${this.epsgResults_}`; } /** diff --git a/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinatescontrol.js b/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinatescontrol.js index 9bef06eb7..695aea118 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinatescontrol.js +++ b/api-idee-js/src/plugins/infocoordinates/src/facade/js/infocoordinatescontrol.js @@ -44,8 +44,9 @@ export default class InfocoordinatesControl extends IDEE.Control { this.outputDownloadFormat = options.outputDownloadFormat; this.projections = IDEE.impl.ol.js.projections.getSupportedProjs(); this.selectedProjection = null; - this.displayON = false; + this.epsgResults = options.epsgResults; + this.epsgResultsTemplate = null; } /** @@ -56,7 +57,7 @@ export default class InfocoordinatesControl extends IDEE.Control { * @param {IDEE.Map} map to add the control * @api stable */ - createView(map) { + async createView(map) { this.map_ = map; this.selectedProjection = this.map_.getProjection().code; this.isProjGeographic = this.getImpl().isProjGeographic(this.selectedProjection); @@ -80,61 +81,97 @@ export default class InfocoordinatesControl extends IDEE.Control { }; } - return new Promise((success, fail) => { - const options = { - jsonp: true, - vars: { - hasHelp: this.helpUrl !== undefined && IDEE.utils.isUrl(this.helpUrl), - helpUrl: this.helpUrl, - projections: this.projections, - datum: this.getImpl().datumCalc(this.selectedProjection), - geographicProj: this.isProjGeographic, - translations: { - title: getValue('title'), - point: getValue('point'), - datum: getValue('datum'), - latitude: getValue('latitude'), - longitude: getValue('longitude'), - formatCoordinates: getValue('formatCoordinates'), - coordX: getValue('coordX'), - coordY: getValue('coordY'), - altitude: getValue('altitude'), - removePoint: getValue('removePoint'), - removeAllPoints: getValue('removeAllPoints'), - importAllPoints: getValue('importAllPoints'), - copyLatLon: getValue('copyLatLon'), - copyxy: getValue('copyxy'), - copyAllPoints: getValue('copyAllPoints'), - displayONAllPoints: getValue('displayONAllPoints'), - displayOFFAllPoints: getValue('displayOFFAllPoints'), - select_srs: getValue('select_srs'), - choose_create_epsg: getValue('choose_create_epsg'), - }, + if (this.epsgResults) { + const validated = []; + const results = await Promise.all( + this.epsgResults.map(async (epsg) => { + const valid = await IDEE.impl.ol.js.projections.ensureProjection(epsg); + if (!valid) { + IDEE.dialog.error(`${getValue('exception.epsgResultsInvalid')}${epsg}`); + } + return valid ? epsg : null; + }), + ); + validated.push(...results.filter(Boolean)); + this.epsgResults = validated.length > 0 ? validated : null; + if (this.epsgResults) { + this.epsgResultsTemplate = this.epsgResults.map((code) => ({ + code, + safeCode: code.replace(':', '-'), + isGeo: this.getImpl().isProjGeographic(code), + })); + } + } + + const templateOptions = { + jsonp: true, + vars: { + hasEpsgResults: !!this.epsgResults, + epsgResultsTemplate: this.epsgResultsTemplate, + hasHelp: this.helpUrl !== undefined && IDEE.utils.isUrl(this.helpUrl), + helpUrl: this.helpUrl, + projections: this.projections, + datum: this.getImpl().datumCalc(this.selectedProjection), + geographicProj: this.isProjGeographic, + translations: { + title: getValue('title'), + point: getValue('point'), + datum: getValue('datum'), + latitude: getValue('latitude'), + longitude: getValue('longitude'), + formatCoordinates: getValue('formatCoordinates'), + coordX: getValue('coordX'), + coordY: getValue('coordY'), + altitude: getValue('altitude'), + removePoint: getValue('removePoint'), + removeAllPoints: getValue('removeAllPoints'), + importAllPoints: getValue('importAllPoints'), + copyLatLon: getValue('copyLatLon'), + copyxy: getValue('copyxy'), + copyAllPoints: getValue('copyAllPoints'), + displayONAllPoints: getValue('displayONAllPoints'), + displayOFFAllPoints: getValue('displayOFFAllPoints'), + select_srs: getValue('select_srs'), + choose_create_epsg: getValue('choose_create_epsg'), }, - }; - const html = IDEE.template.compileSync(template, options); + }, + }; + + const html = IDEE.template.compileSync(template, templateOptions); + + if (!this.epsgResults) { this.initCustomDropdown(html); - // Añadir código dependiente del DOM - this.accessibilityTab(html); - - this.map.addLayers(this.layerFeatures); - - success(html); - html.querySelector('#m-infocoordinates-buttonRemoveAllPoints').addEventListener('click', this.removeAllPoints.bind(this)); - html.querySelector('#m-infocoordinates-buttonImportAllPoints').addEventListener('click', this.importAllPoints.bind(this)); - html.querySelector('#m-infocoordinates-buttonCopyAllPoints').addEventListener('click', this.copyAllPoints.bind(this)); - html.querySelector('#m-infocoordinates-buttonDisplayAllPoints').addEventListener('click', this.displayAllPoints.bind(this)); - html.querySelector('#m-infocoordinates-buttonConversorFormat').addEventListener('change', this.changeSelectSRSorChangeFormat.bind(this)); - html.querySelector('#m-infocoordinates-buttonRemovePoint').addEventListener('click', this.removePoint.bind(this)); + } + this.accessibilityTab(html); + this.map.addLayers(this.layerFeatures); + + html.querySelector('#m-infocoordinates-buttonRemoveAllPoints').addEventListener('click', this.removeAllPoints.bind(this)); + html.querySelector('#m-infocoordinates-buttonImportAllPoints').addEventListener('click', this.importAllPoints.bind(this)); + html.querySelector('#m-infocoordinates-buttonCopyAllPoints').addEventListener('click', this.copyAllPoints.bind(this)); + html.querySelector('#m-infocoordinates-buttonDisplayAllPoints').addEventListener('click', this.displayAllPoints.bind(this)); + html.querySelector('#m-infocoordinates-buttonConversorFormat').addEventListener('change', this.changeSelectSRSorChangeFormat.bind(this)); + html.querySelector('#m-infocoordinates-buttonRemovePoint').addEventListener('click', this.removePoint.bind(this)); + + if (!this.epsgResults) { html.querySelector('#m-infocoordinates-copylatlon').addEventListener('click', this.copylatlon.bind(this)); html.querySelector('#m-infocoordinates-copyxy').addEventListener('click', this.copyxy.bind(this)); - const helpBtn = html.querySelector('#m-infocoordinates-help-icon'); - if (helpBtn) helpBtn.addEventListener('click', this.showHelp.bind(this)); (this.isProjGeographic ? html.querySelector('#m-infocoordinates-geo-coords') : html.querySelector('#m-infocoordinates-utm-coords') ).classList.remove('noDisplay'); - }); + } else { + html.querySelectorAll('.m-infocoordinates-copylatlon-btn').forEach((btn) => { + btn.addEventListener('click', () => this.copylatlonMulti(btn.dataset.epsg)); + }); + html.querySelectorAll('.m-infocoordinates-copyxy-btn').forEach((btn) => { + btn.addEventListener('click', () => this.copyxyMulti(btn.dataset.epsg)); + }); + } + + const helpBtn = html.querySelector('#m-infocoordinates-help-icon'); + if (helpBtn) helpBtn.addEventListener('click', this.showHelp.bind(this)); + + return html; } /** @@ -274,11 +311,16 @@ export default class InfocoordinatesControl extends IDEE.Control { addPoint(evt) { const numPoint = this.numTabs + 1; - document.getElementById('m-infocoordinates-srs-selector').removeAttribute('disabled'); + + if (!this.epsgResults) { + document.getElementById('m-infocoordinates-srs-selector').removeAttribute('disabled'); + } if (this.numTabs === 0) { document.getElementById('m-infocoordinates-buttonRemovePoint').classList.remove('noDisplay'); - document.getElementById('m-infocoordinates-copylatlon').classList.remove('noDisplay'); + if (!this.epsgResults) { + document.getElementById('m-infocoordinates-copylatlon').classList.remove('noDisplay'); + } document.getElementsByClassName('m-infocoordinates-div-buttonRemoveAllPoints')[0].classList.remove('noDisplay'); document.getElementsByClassName('m-infocoordinates-div-buttonImportAllPoints')[0].classList.remove('noDisplay'); @@ -289,7 +331,7 @@ export default class InfocoordinatesControl extends IDEE.Control { // Mostramos la barra de herramientas inferior const toolbar = document.querySelector('.infocoordinates-toolbar'); if (toolbar) { - toolbar.style.display = 'flex'; // O como prefieras mostrarla + toolbar.style.display = 'flex'; } // Eliminamos las etiquetas de los puntos @@ -456,8 +498,6 @@ export default class InfocoordinatesControl extends IDEE.Control { document.getElementsByClassName('contenedorPuntoSelect')[0].classList.replace('contenedorPuntoSelect', 'contenedorPunto'); } - // const textHTML = `
${numPoint}
`; - const textHTML = `
@@ -532,62 +572,97 @@ export default class InfocoordinatesControl extends IDEE.Control { async displayXYcoordinates(numPoint) { const featureSelected = this.layerFeatures.getFeatureById(numPoint); - - // Capturo los elementos const pointBox = document.getElementById('m-infocoordinates-point'); - const latitudeBox = document.getElementById('m-infocoordinates-latitude'); - const longitudeBox = document.getElementById('m-infocoordinates-longitude'); - const datumBox = document.getElementById('m-infocoordinates-datum'); - const coordX = document.getElementById('m-infocoordinates-coordX'); - const coordY = document.getElementById('m-infocoordinates-coordY'); - const inputSRS = document.querySelector('.m-infocoordinates-input-select'); - const selector = document.querySelector('#m-infocoordinates-srs-selector'); - - // Cojo el srs seleccionado en el select - const selectSRS = !inputSRS.value.startsWith('EPSG:') ? `EPSG:${inputSRS.value}` : inputSRS.value; - - // Cojo el formato de las coordenadas geográficas const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; - // Cambio coordenadas y calculo las UTM - if (!await IDEE.impl.ol.js.projections.ensureProjection(selectSRS)) { - IDEE.dialog.error(`${getValue('exception.srs')} ${this.selectedProjection}`); - } else { - this.selectedProjection = selectSRS; - } - const pointDataOutput = this.getImpl().getCoordinates( - featureSelected, - this.selectedProjection, - formatGMS, - this.decimalGEOcoord_, - this.decimalUTMcoord_, - ); - inputSRS.value = this.selectedProjection; - this.isProjGeographic = this.getImpl().isProjGeographic(this.selectedProjection); - const gmsButton = document.getElementById('m-infocoordinates-buttonConversorFormat'); - if (this.isProjGeographic) { - document.getElementById('m-infocoordinates-geo-coords').classList.remove('noDisplay'); - document.getElementById('m-infocoordinates-utm-coords').classList.add('noDisplay'); - gmsButton.removeAttribute('disabled'); + if (this.epsgResults) { + pointBox.innerHTML = numPoint; + const gmsButtonMulti = document.getElementById('m-infocoordinates-buttonConversorFormat'); + if (this.epsgResultsTemplate.some((e) => e.isGeo)) { + gmsButtonMulti.removeAttribute('disabled'); + } + this.epsgResultsTemplate.forEach(({ code, safeCode, isGeo }) => { + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + code, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + + const datumEl = document.getElementById(`m-infocoordinates-datum-${safeCode}`); + if (datumEl) datumEl.innerHTML = pointDataOutput.projectionUTM.datum; + + if (isGeo) { + const latEl = document.getElementById(`m-infocoordinates-latitude-${safeCode}`); + const lonEl = document.getElementById(`m-infocoordinates-longitude-${safeCode}`); + const geoCoords = pointDataOutput.projectionGEO.coordinatesGEO; + if (latEl) latEl.innerHTML = `${geoCoords.latitude}`.replace('.', ','); + if (lonEl) lonEl.innerHTML = `${geoCoords.longitude}`.replace('.', ','); + } else { + const xEl = document.getElementById(`m-infocoordinates-coordX-${safeCode}`); + const yEl = document.getElementById(`m-infocoordinates-coordY-${safeCode}`); + if (xEl) { + xEl.innerHTML = this.formatUTMCoordinate( + pointDataOutput.projectionUTM.coordinatesUTM.coordX, + ); + } + if (yEl) { + yEl.innerHTML = this.formatUTMCoordinate( + pointDataOutput.projectionUTM.coordinatesUTM.coordY, + ); + } + } + }); } else { - document.getElementById('m-infocoordinates-geo-coords').classList.add('noDisplay'); - document.getElementById('m-infocoordinates-utm-coords').classList.remove('noDisplay'); - gmsButton.checked = false; - gmsButton.setAttribute('disabled', 'disabled'); + const latitudeBox = document.getElementById('m-infocoordinates-latitude'); + const longitudeBox = document.getElementById('m-infocoordinates-longitude'); + const datumBox = document.getElementById('m-infocoordinates-datum'); + const coordX = document.getElementById('m-infocoordinates-coordX'); + const coordY = document.getElementById('m-infocoordinates-coordY'); + const inputSRS = document.querySelector('.m-infocoordinates-input-select'); + const selector = document.querySelector('#m-infocoordinates-srs-selector'); + + const selectSRS = !inputSRS.value.startsWith('EPSG:') ? `EPSG:${inputSRS.value}` : inputSRS.value; + + if (!await IDEE.impl.ol.js.projections.ensureProjection(selectSRS)) { + IDEE.dialog.error(`${getValue('exception.srs')} ${this.selectedProjection}`); + } else { + this.selectedProjection = selectSRS; + } + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + this.selectedProjection, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + inputSRS.value = this.selectedProjection; + this.isProjGeographic = this.getImpl().isProjGeographic(this.selectedProjection); + const gmsButton = document.getElementById('m-infocoordinates-buttonConversorFormat'); + if (this.isProjGeographic) { + document.getElementById('m-infocoordinates-geo-coords').classList.remove('noDisplay'); + document.getElementById('m-infocoordinates-utm-coords').classList.add('noDisplay'); + gmsButton.removeAttribute('disabled'); + } else { + document.getElementById('m-infocoordinates-geo-coords').classList.add('noDisplay'); + document.getElementById('m-infocoordinates-utm-coords').classList.remove('noDisplay'); + gmsButton.checked = false; + gmsButton.setAttribute('disabled', 'disabled'); + } + this.refreshProjectionsSelector(selector); + + pointBox.innerHTML = pointDataOutput.NumPoint; + latitudeBox.innerHTML = `${pointDataOutput.projectionGEO.coordinatesGEO.latitude}`.replace('.', ','); + longitudeBox.innerHTML = `${pointDataOutput.projectionGEO.coordinatesGEO.longitude}`.replace('.', ','); + datumBox.innerHTML = pointDataOutput.projectionUTM.datum; + coordX.innerHTML = this.formatUTMCoordinate( + pointDataOutput.projectionUTM.coordinatesUTM.coordX, + ); + coordY.innerHTML = this.formatUTMCoordinate( + pointDataOutput.projectionUTM.coordinatesUTM.coordY, + ); } - this.refreshProjectionsSelector(selector); - - // pinto - pointBox.innerHTML = pointDataOutput.NumPoint; - latitudeBox.innerHTML = `${pointDataOutput.projectionGEO.coordinatesGEO.latitude}`.replace('.', ','); - longitudeBox.innerHTML = `${pointDataOutput.projectionGEO.coordinatesGEO.longitude}`.replace('.', ','); - datumBox.innerHTML = pointDataOutput.projectionUTM.datum; - coordX.innerHTML = this.formatUTMCoordinate( - pointDataOutput.projectionUTM.coordinatesUTM.coordX, - ); - coordY.innerHTML = this.formatUTMCoordinate( - pointDataOutput.projectionUTM.coordinatesUTM.coordY, - ); } displayZcoordinate(numPoint) { @@ -677,87 +752,175 @@ export default class InfocoordinatesControl extends IDEE.Control { IDEE.toast.success(getValue('clipboard')); } - copyAllPoints() { - let printDocument = `${getValue('point').replace(':', '')},${this.isProjGeographic ? 'Long,Lat' : 'X,Y'},Alt,EPSG\n`; - for (let i = 0; i < this.layerFeatures.getImpl().getFeatures(true).length; i += 1) { - const featureSelected = this.layerFeatures.getImpl().getFeatures(true)[i]; - const alt = featureSelected.getAttributes().Altitude !== undefined ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; - - // Cojo el srs seleccionado en el select - const selectSRS = document.getElementById('m-infocoordinates-epsg-selected').value; - - // Cojo el formato de las coordenadas geográficas - const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; + copylatlonMulti(epsgCode) { + const safeCode = epsgCode.replace(':', '-'); + const latEl = document.getElementById(`m-infocoordinates-latitude-${safeCode}`); + const lonEl = document.getElementById(`m-infocoordinates-longitude-${safeCode}`); + const lat = latEl.innerHTML.replace(',', '.'); + const lon = lonEl.innerHTML.replace(',', '.'); + const alt = document.getElementById('m-infocoordinates-altitude').innerHTML.replace(',', '.'); + navigator.clipboard.writeText(`${lon},${lat},${alt},${epsgCode}`); + IDEE.toast.success(getValue('clipboard')); + } - // Cambio coordenadas y calculo las UTM - const pointDataOutput = this.getImpl().getCoordinates( - featureSelected, - selectSRS, - formatGMS, - this.decimalGEOcoord_, - this.decimalUTMcoord_, - ); + copyxyMulti(epsgCode) { + const safeCode = epsgCode.replace(':', '-'); + const xEl = document.getElementById(`m-infocoordinates-coordX-${safeCode}`); + const yEl = document.getElementById(`m-infocoordinates-coordY-${safeCode}`); + const altEl = document.getElementById('m-infocoordinates-altitude'); + const x = xEl.innerHTML.replaceAll('.', '').replace(',', '.'); + const y = yEl.innerHTML.replaceAll('.', '').replace(',', '.'); + const alt = altEl.innerHTML.replace(',', '.'); + navigator.clipboard.writeText(`${x},${y},${alt},${epsgCode}`); + IDEE.toast.success(getValue('clipboard')); + } - const coordinates = this.isProjGeographic - ? [ - pointDataOutput.projectionGEO.coordinatesGEO.longitude, - pointDataOutput.projectionGEO.coordinatesGEO.latitude, - ] - : [ - pointDataOutput.projectionUTM.coordinatesUTM.coordX, - pointDataOutput.projectionUTM.coordinatesUTM.coordY, - ]; + copyAllPoints() { + const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; - const result = `${i + 1},${coordinates},${alt.toString()},${this.selectedProjection}\n`; + if (this.epsgResults) { + const printDocument = this.layerFeatures.getImpl().getFeatures(true) + .map((featureSelected, idx) => { + const alt = featureSelected.getAttributes().Altitude !== undefined + ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; + const epsgLines = this.epsgResultsTemplate.map(({ code, isGeo }) => { + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + code, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + const geo = pointDataOutput.projectionGEO.coordinatesGEO; + const utm = pointDataOutput.projectionUTM.coordinatesUTM; + const coords = isGeo + ? `${geo.longitude},${geo.latitude}` + : `${utm.coordX},${utm.coordY}`; + return `${code}: ${coords},${alt}`; + }).join('\n'); + return `${getValue('point').replace(':', '')} ${idx + 1}\n${epsgLines}`; + }).join('\n\n'); + navigator.clipboard.writeText(printDocument); + IDEE.toast.success(getValue('clipboard')); + } else { + let printDocument = `${getValue('point').replace(':', '')},${this.isProjGeographic ? 'Long,Lat' : 'X,Y'},Alt,EPSG\n`; + for (let i = 0; i < this.layerFeatures.getImpl().getFeatures(true).length; i += 1) { + const featureSelected = this.layerFeatures.getImpl().getFeatures(true)[i]; + const alt = featureSelected.getAttributes().Altitude !== undefined ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; + + const selectSRS = document.getElementById('m-infocoordinates-epsg-selected').value; + + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + selectSRS, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + + const coordinates = this.isProjGeographic + ? [ + pointDataOutput.projectionGEO.coordinatesGEO.longitude, + pointDataOutput.projectionGEO.coordinatesGEO.latitude, + ] + : [ + pointDataOutput.projectionUTM.coordinatesUTM.coordX, + pointDataOutput.projectionUTM.coordinatesUTM.coordY, + ]; + + const result = `${i + 1},${coordinates},${alt.toString()},${this.selectedProjection}\n`; + printDocument = printDocument.concat(result); + } - printDocument = printDocument.concat(result); + navigator.clipboard.writeText(printDocument); + IDEE.toast.success(getValue('clipboard')); } - - navigator.clipboard.writeText(printDocument); - IDEE.toast.success(getValue('clipboard')); } importAllPoints() { + const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; const printDocument = []; - if (this.outputDownloadFormat === 'csv') { - printDocument.push(`${getValue('point').replace(':', '')},${this.isProjGeographic ? 'Long,Lat' : 'X,Y'},Alt,EPSG\n`); - } - for (let i = 0; i < this.layerFeatures.getImpl().getFeatures(true).length; i += 1) { - const featureSelected = this.layerFeatures.getImpl().getFeatures(true)[i]; - const alt = featureSelected.getAttributes().Altitude !== undefined ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; - - // Cojo el srs seleccionado en el select - const selectSRS = document.getElementById('m-infocoordinates-epsg-selected').value; - - // Cojo el formato de las coordenadas geográficas - const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; - - // Cambio coordenadas y calculo las UTM - const pointDataOutput = this.getImpl().getCoordinates( - featureSelected, - selectSRS, - formatGMS, - this.decimalGEOcoord_, - this.decimalUTMcoord_, - ); - - const coordinates = this.isProjGeographic - ? [ - pointDataOutput.projectionGEO.coordinatesGEO.longitude, - pointDataOutput.projectionGEO.coordinatesGEO.latitude, - ] - : [ - pointDataOutput.projectionUTM.coordinatesUTM.coordX, - pointDataOutput.projectionUTM.coordinatesUTM.coordY, - ]; + if (this.epsgResults) { if (this.outputDownloadFormat === 'csv') { - printDocument.push(`${i + 1},${coordinates},${alt.toString()},${this.selectedProjection}\n`); + printDocument.push(`${getValue('point').replace(':', '')},Coord1,Coord2,Alt,EPSG\n`); + this.layerFeatures.getImpl().getFeatures(true).forEach((featureSelected, idx) => { + const alt = featureSelected.getAttributes().Altitude !== undefined + ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; + this.epsgResultsTemplate.forEach(({ code, isGeo }) => { + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + code, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + const geo = pointDataOutput.projectionGEO.coordinatesGEO; + const utm = pointDataOutput.projectionUTM.coordinatesUTM; + const coords = isGeo + ? `${geo.longitude},${geo.latitude}` + : `${utm.coordX},${utm.coordY}`; + printDocument.push(`${idx + 1},${coords},${alt},${code}\n`); + }); + }); } else { - printDocument.push(`${getValue('point').replace(':', ' ')}${i + 1}: \n`); - printDocument.push(`${this.selectedProjection}: `); - - printDocument.push(`[${coordinates},${alt}]\n`); + this.layerFeatures.getImpl().getFeatures(true).forEach((featureSelected, idx) => { + const alt = featureSelected.getAttributes().Altitude !== undefined + ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; + printDocument.push(`${getValue('point').replace(':', ' ')}${idx + 1}:\n`); + this.epsgResultsTemplate.forEach(({ code, isGeo }) => { + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + code, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + const geo = pointDataOutput.projectionGEO.coordinatesGEO; + const utm = pointDataOutput.projectionUTM.coordinatesUTM; + const coords = isGeo + ? `${geo.longitude},${geo.latitude}` + : `${utm.coordX},${utm.coordY}`; + printDocument.push(`${code}: [${coords},${alt}]\n`); + }); + printDocument.push('\n'); + }); + } + } else { + if (this.outputDownloadFormat === 'csv') { + printDocument.push(`${getValue('point').replace(':', '')},${this.isProjGeographic ? 'Long,Lat' : 'X,Y'},Alt,EPSG\n`); + } + for (let i = 0; i < this.layerFeatures.getImpl().getFeatures(true).length; i += 1) { + const featureSelected = this.layerFeatures.getImpl().getFeatures(true)[i]; + const alt = featureSelected.getAttributes().Altitude !== undefined ? parseFloat(featureSelected.getAttributes().Altitude) : '-'; + + const selectSRS = document.getElementById('m-infocoordinates-epsg-selected').value; + + const pointDataOutput = this.getImpl().getCoordinates( + featureSelected, + selectSRS, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + + const coordinates = this.isProjGeographic + ? [ + pointDataOutput.projectionGEO.coordinatesGEO.longitude, + pointDataOutput.projectionGEO.coordinatesGEO.latitude, + ] + : [ + pointDataOutput.projectionUTM.coordinatesUTM.coordX, + pointDataOutput.projectionUTM.coordinatesUTM.coordY, + ]; + + if (this.outputDownloadFormat === 'csv') { + printDocument.push(`${i + 1},${coordinates},${alt.toString()},${this.selectedProjection}\n`); + } else { + printDocument.push(`${getValue('point').replace(':', ' ')}${i + 1}: \n`); + printDocument.push(`${this.selectedProjection}: `); + printDocument.push(`[${coordinates},${alt}]\n`); + } } } @@ -785,25 +948,57 @@ export default class InfocoordinatesControl extends IDEE.Control { } document.getElementsByClassName('contenedorPuntoSelect')[0].style = 'display: none'; + const formatGMS = document.getElementById('m-infocoordinates-buttonConversorFormat').checked; + // Creamos las etiquetas de los puntos - for (let i = 0; i < this.layerFeatures.getImpl().getFeatures(true).length; i += 1) { - const pos = this.layerFeatures.getImpl() - .getFeatures(true)[i].getImpl().getFeature().getProperties().coordinates; - const varUTM = this.calculateCoordinates(i + 1); - const altitude = `${parseFloat(this.layerFeatures.getImpl().getFeatures(true)[i].getImpl().getFeature().getProperties().Altitude).toFixed(2)}`.replace('.', ','); + this.layerFeatures.getImpl().getFeatures(true).forEach((implFeature, idx) => { + const pos = implFeature.getImpl().getFeature().getProperties().coordinates; + const altRaw = implFeature.getImpl().getFeature().getProperties().Altitude; + const altitude = `${parseFloat(altRaw).toFixed(2)}`.replace('.', ','); + + let coordsHTML = ''; + + if (this.epsgResults) { + const facadeFeature = this.layerFeatures.getFeatureById(idx + 1); + this.epsgResultsTemplate.forEach(({ code, isGeo }) => { + const pointDataOutput = this.getImpl().getCoordinates( + facadeFeature, + code, + formatGMS, + this.decimalGEOcoord_, + this.decimalUTMcoord_, + ); + if (isGeo) { + const geo = pointDataOutput.projectionGEO.coordinatesGEO; + const lat = `${geo.latitude}`.replace('.', ','); + const lon = `${geo.longitude}`.replace('.', ','); + coordsHTML += ``; + } else { + const utm = pointDataOutput.projectionUTM.coordinatesUTM; + const x = this.formatUTMCoordinate(utm.coordX); + const y = this.formatUTMCoordinate(utm.coordY); + coordsHTML += ``; + } + }); + } else { + const varUTM = this.calculateCoordinates(idx + 1); + coordsHTML = ` + + + + + + `; + } + const textHTML = `
${code}: ${lon}, ${lat}
${code}: X=${x} Y=${y}
X: ${this.formatUTMCoordinate(varUTM[0])}
Y: ${this.formatUTMCoordinate(varUTM[1])}
- - - - - - - + + ${coordsHTML} @@ -828,7 +1023,7 @@ export default class InfocoordinatesControl extends IDEE.Control { this.helpTooltip_.setPosition(pos); this.map.getMapImpl().addOverlay(this.helpTooltip_); - } + }); this.displayON = true; } } @@ -909,21 +1104,39 @@ export default class InfocoordinatesControl extends IDEE.Control { divTabContainer.innerHTML = ''; document.getElementById('m-infocoordinates-point').innerHTML = '--'; - document.getElementById('m-infocoordinates-latitude').innerHTML = '--'; - document.getElementById('m-infocoordinates-longitude').innerHTML = '--'; - document.getElementById('m-infocoordinates-coordX').innerHTML = '--'; - document.getElementById('m-infocoordinates-coordY').innerHTML = '--'; document.getElementById('m-infocoordinates-altitude').innerHTML = '--'; + if (this.epsgResults) { + this.epsgResultsTemplate.forEach(({ safeCode, isGeo }) => { + const datumEl = document.getElementById(`m-infocoordinates-datum-${safeCode}`); + if (datumEl) datumEl.innerHTML = '--'; + if (isGeo) { + const latEl = document.getElementById(`m-infocoordinates-latitude-${safeCode}`); + const lonEl = document.getElementById(`m-infocoordinates-longitude-${safeCode}`); + if (latEl) latEl.innerHTML = '--'; + if (lonEl) lonEl.innerHTML = '--'; + } else { + const xEl = document.getElementById(`m-infocoordinates-coordX-${safeCode}`); + const yEl = document.getElementById(`m-infocoordinates-coordY-${safeCode}`); + if (xEl) xEl.innerHTML = '--'; + if (yEl) yEl.innerHTML = '--'; + } + }); + } else { + document.getElementById('m-infocoordinates-latitude').innerHTML = '--'; + document.getElementById('m-infocoordinates-longitude').innerHTML = '--'; + document.getElementById('m-infocoordinates-coordX').innerHTML = '--'; + document.getElementById('m-infocoordinates-coordY').innerHTML = '--'; + document.getElementById('m-infocoordinates-copylatlon').classList.add('noDisplay'); + document.getElementById('m-infocoordinates-copyxy').classList.add('noDisplay'); + } + document.getElementById('m-infocoordinates-buttonRemovePoint').classList.add('noDisplay'); - document.getElementById('m-infocoordinates-copylatlon').classList.add('noDisplay'); - document.getElementById('m-infocoordinates-copyxy').classList.add('noDisplay'); document.getElementsByClassName('m-infocoordinates-div-buttonRemoveAllPoints')[0].classList.add('noDisplay'); document.getElementsByClassName('m-infocoordinates-div-buttonImportAllPoints')[0].classList.add('noDisplay'); document.getElementsByClassName('m-infocoordinates-div-buttonCopyAllPoints')[0].classList.add('noDisplay'); document.getElementsByClassName('m-infocoordinates-div-buttonDisplayAllPoints')[0].classList.add('noDisplay'); document.getElementById('m-infocoordinates-buttonConversorFormat').setAttribute('disabled', 'disabled'); - // document.getElementById('m-infocoordinates-comboDatum').setAttribute('disabled', 'disabled'); // Elimino todas las features this.layerFeatures.removeFeatures((this.layerFeatures.getFeatures())); diff --git a/api-idee-js/src/plugins/infocoordinates/src/impl/ol/js/infocoordinatescontrol.js b/api-idee-js/src/plugins/infocoordinates/src/impl/ol/js/infocoordinatescontrol.js index 55ba3cf88..45230bbcd 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/impl/ol/js/infocoordinatescontrol.js +++ b/api-idee-js/src/plugins/infocoordinates/src/impl/ol/js/infocoordinatescontrol.js @@ -80,14 +80,17 @@ export default class InfocoordinatesControl extends IDEE.impl.Control { } datumCalc(srs) { - return IDEE.impl.ol.js.projections.getSupportedProjs() - .find((p) => p.codes.includes(srs)) - .datum; + const proj = IDEE.impl.ol.js.projections.getSupportedProjs() + .find((p) => p.codes.includes(srs)); + return proj ? proj.datum : srs; } isProjGeographic(srs) { - return IDEE.impl.ol.js.projections.getSupportedProjs() - .find((p) => p.codes.includes(srs)).units === 'd'; + const proj = IDEE.impl.ol.js.projections.getSupportedProjs() + .find((p) => p.codes.includes(srs)); + if (proj) return proj.units === 'd'; + const olProj = ol.proj.get(srs); + return olProj ? olProj.getUnits() === 'degrees' : false; } readAltitudeFromElevationProcess(coordinates, srcMapa) { diff --git a/api-idee-js/src/plugins/infocoordinates/src/templates/infocoordinates.html b/api-idee-js/src/plugins/infocoordinates/src/templates/infocoordinates.html index 2e6983208..07d6217db 100644 --- a/api-idee-js/src/plugins/infocoordinates/src/templates/infocoordinates.html +++ b/api-idee-js/src/plugins/infocoordinates/src/templates/infocoordinates.html @@ -14,6 +14,50 @@ -- + + {{#if hasEpsgResults}} + +
+ {{translations.altitude}} + -- +
+
+ + +
+ + {{#each epsgResultsTemplate}} +
+
+ {{this.code}} + -- +
+ {{#if this.isGeo}} +
+ {{../translations.latitude}} + -- + +
+
+ {{../translations.longitude}} + -- +
+ {{else}} +
+ {{../translations.coordX}} + -- + +
+
+ {{../translations.coordY}} + -- +
+ {{/if}} +
+ {{/each}} + + {{else}} +
{{translations.datum}} ETRS89 @@ -83,6 +127,8 @@
+ {{/if}} +
diff --git a/api-idee-js/src/plugins/infocoordinates/test/dev.html b/api-idee-js/src/plugins/infocoordinates/test/dev.html index eee588476..cc404ec71 100644 --- a/api-idee-js/src/plugins/infocoordinates/test/dev.html +++ b/api-idee-js/src/plugins/infocoordinates/test/dev.html @@ -69,6 +69,13 @@
+
+ + + + + +
diff --git a/api-idee-js/src/plugins/infocoordinates/test/test.js b/api-idee-js/src/plugins/infocoordinates/test/test.js index 4f59762ab..684ba7d55 100644 --- a/api-idee-js/src/plugins/infocoordinates/test/test.js +++ b/api-idee-js/src/plugins/infocoordinates/test/test.js @@ -37,6 +37,7 @@ const inputHelpUrl = document.getElementById('inputHelpUrl'); const inputDecimalGEOcoord = document.getElementById('inputDecimalGEOcoord'); const inputDecimalUTMcoord = document.getElementById('inputDecimalUTMcoord'); const selectOutputDownloadFormat = document.getElementById('selectOutputDownloadFormat'); +const inputEpsgResults = document.getElementById('inputEpsgResults'); const updatePlugin = () => { const options = {}; @@ -48,6 +49,7 @@ const updatePlugin = () => { options.decimalGEOcoord = Number(inputDecimalGEOcoord.value); options.decimalUTMcoord = Number(inputDecimalUTMcoord.value); options.outputDownloadFormat = selectOutputDownloadFormat.options[selectOutputDownloadFormat.selectedIndex].value; + options.epsgResults = inputEpsgResults.value; removePlugin(); createPlugin(options); @@ -62,6 +64,7 @@ const updatePlugin = () => { inputDecimalGEOcoord, inputDecimalUTMcoord, selectOutputDownloadFormat, + inputEpsgResults, ].forEach((ctrl) => { ctrl.addEventListener('change', updatePlugin); }); diff --git a/api-idee-js/src/plugins/layerswitcher/src/facade/assets/css/layerswitcher.css b/api-idee-js/src/plugins/layerswitcher/src/facade/assets/css/layerswitcher.css index e5765c1c0..e18b75c5b 100644 --- a/api-idee-js/src/plugins/layerswitcher/src/facade/assets/css/layerswitcher.css +++ b/api-idee-js/src/plugins/layerswitcher/src/facade/assets/css/layerswitcher.css @@ -499,7 +499,8 @@ input[type=range].layerswitcher-transparency { /************************** ADDSERVICESRESULTS.HTML **************************/ -.m-layerswitcher-show-capabilities { +.m-layerswitcher-show-capabilities, +.m-layerswitcher-show-capabilities-wfs { display: flex; align-items: center; gap: 8px; @@ -508,7 +509,8 @@ input[type=range].layerswitcher-transparency { font-size: 12px; } -.m-layerswitcher-show-capabilities:hover { +.m-layerswitcher-show-capabilities:hover, +.m-layerswitcher-show-capabilities-wfs:hover { color: var(--idee-color-links); } diff --git a/api-idee-js/src/plugins/layerswitcher/src/facade/js/layerswitchercontrol.js b/api-idee-js/src/plugins/layerswitcher/src/facade/js/layerswitchercontrol.js index 913c4c05c..4ef1989b7 100644 --- a/api-idee-js/src/plugins/layerswitcher/src/facade/js/layerswitchercontrol.js +++ b/api-idee-js/src/plugins/layerswitcher/src/facade/js/layerswitchercontrol.js @@ -1057,6 +1057,8 @@ export default class LayerswitcherControl extends IDEE.Control { addSuggestions.style.display = 'none'; const url = searchInput.value.trim().split('?')[0]; this.removeContains(evt); + this.capabilities = undefined; + this.serviceCapabilities = undefined; if (!IDEE.utils.isNullOrEmpty(url)) { if (IDEE.utils.isUrl(url)) { if (this.http && !this.https) { @@ -1141,7 +1143,12 @@ export default class LayerswitcherControl extends IDEE.Control { } else if (url.indexOf('{z}/{x}/{y}') >= 0) { this.printLayerModal(url, 'xyz'); } else { - const promise = new Promise((success, reject) => { + const urlLower = url.toLowerCase(); + const fullUrlLower = searchInput.value.trim().toLowerCase(); + const isWFSPath = urlLower.endsWith('/wfs') || urlLower.endsWith('/wfsserver') || fullUrlLower.includes('service=wfs'); + const isWMSPath = urlLower.endsWith('/wms') || urlLower.endsWith('/wmsserver') || fullUrlLower.includes('service=wms'); + + const promise = (isWFSPath || isWMSPath) ? Promise.resolve({ text: '' }) : new Promise((success, reject) => { const id = setTimeout(() => reject(), 15000); // IDEE.proxy(this.useProxy); IDEE.remote.get(IDEE.utils.getWMTSGetCapabilitiesUrl(url)).then((response) => { @@ -1164,10 +1171,6 @@ export default class LayerswitcherControl extends IDEE.Control { this.capabilities = this.filterResults(layers); this.showResults(); } else { - const urlLower = url.toLowerCase(); - const isWFSPath = urlLower.endsWith('/wfs') || urlLower.includes('service=wfs'); - const isWMSPath = urlLower.endsWith('/wms') || urlLower.includes('service=wms'); - const promise2 = (isWFSPath) ? Promise.resolve({ text: '' }) : new Promise((success, reject) => { const id = setTimeout(() => reject(), 15000); IDEE.remote.get(IDEE.utils.getWMSGetCapabilitiesUrl(url, '1.3.0')).then((response2) => { @@ -1553,7 +1556,9 @@ export default class LayerswitcherControl extends IDEE.Control { const services = []; const formatDefault = []; - const operation = response.text.split('')[1].split('')[0]; + const text = this.normalizeWFSNamespace_(response.text); + + const operation = text.split('')[1].split('')[0]; const outputFormat = operation.split('')[1].split('')[0]; let allowedValues = ''; if (outputFormat.indexOf('') > -1) { @@ -1571,9 +1576,10 @@ export default class LayerswitcherControl extends IDEE.Control { }); } - const defaultFormatGetFeature = formatDefault.includes('json') ? 'application/json' : formatDefault[0]; + const jsonFormat = formatDefault.find((f) => /json/i.test(f) && !/^esri/i.test(f)); + const defaultFormatGetFeature = jsonFormat || formatDefault[0]; - const prenode = response.text.split('')[1].split('')[0]; + const prenode = text.split('')[1].split('')[0]; if (prenode.indexOf('') > -1) { const nodes = prenode.split(''); nodes.forEach((node) => { @@ -1585,10 +1591,12 @@ export default class LayerswitcherControl extends IDEE.Control { formats = formatNode.split('').slice(1).map((format) => format.split('')[0].trim()); } + const finalFormats = formats.length === 0 ? [defaultFormatGetFeature] : formats; services.push({ name: node.split('')[0].split('>')[1].trim(), title: node.split('')[0].split('')[1].trim(), - formats: formats.length === 0 ? [defaultFormatGetFeature] : formats, + formats: finalFormats, + format: finalFormats[0], }); } }); @@ -1603,10 +1611,12 @@ export default class LayerswitcherControl extends IDEE.Control { formats = formatNode.split('<Format>').slice(1).map((format) => format.split('</Format>')[0].trim()); } + const finalFormats = formats.length === 0 ? [defaultFormatGetFeature] : formats; services.push({ - name: node.split('</Name>')[0].split('<Name>')[1].trim(), + name: node.split('</Name>')[0].split('>')[1].trim(), title: node.split('')[0].split('')[1].trim(), - formats: formats.length === 0 ? [defaultFormatGetFeature] : formats, + formats: finalFormats, + format: finalFormats[0], }); } }); @@ -1615,21 +1625,21 @@ export default class LayerswitcherControl extends IDEE.Control { const capabilities = {}; let hasCapabilities = false; try { - capabilities.title = response.text.split('<ows:Title>')[1].split('</ows:Title>')[0]; + capabilities.title = text.split('<ows:Title>')[1].split('</ows:Title>')[0]; hasCapabilities = true; } catch (err) { hasCapabilities = hasCapabilities || false; } try { - capabilities.abstract = response.text.split('<ows:Abstract>')[1].split('</ows:Abstract>')[0]; + capabilities.abstract = text.split('<ows:Abstract>')[1].split('</ows:Abstract>')[0]; hasCapabilities = true; } catch (err) { hasCapabilities = hasCapabilities || false; } try { - capabilities.accessConstraints = response.text.split('<ows:AccessConstraints>')[1].split('</ows:AccessConstraints>')[0]; + capabilities.accessConstraints = text.split('<ows:AccessConstraints>')[1].split('</ows:AccessConstraints>')[0]; hasCapabilities = true; } catch (err) { hasCapabilities = hasCapabilities || false; @@ -3114,6 +3124,14 @@ export default class LayerswitcherControl extends IDEE.Control { this.loadCODSIResults(this.select_codsi); } + normalizeWFSNamespace_(xml) { + const taggedElements = ['FeatureTypeList', 'FeatureType', 'Name', 'Title']; + + return taggedElements.reduce((normalizedXml, tagName) => normalizedXml + .replace(new RegExp(`<wfs:${tagName}(\\s|>)`, 'g'), `<${tagName}$1`) + .replace(new RegExp(`</wfs:${tagName}>`, 'g'), `</${tagName}>`), xml); + } + accessibilityTab(html) { html.querySelectorAll('[tabindex="0"]').forEach((el) => el.setAttribute('tabindex', this.order)); } diff --git a/api-idee-js/src/plugins/layerswitcher/src/templates/addservicesresults.html b/api-idee-js/src/plugins/layerswitcher/src/templates/addservicesresults.html index 669f5ff33..e3ea40202 100644 --- a/api-idee-js/src/plugins/layerswitcher/src/templates/addservicesresults.html +++ b/api-idee-js/src/plugins/layerswitcher/src/templates/addservicesresults.html @@ -132,7 +132,7 @@ {{#each layersWFS}} <tr tabindex="0"> <td> - <input type="checkbox" id="{{name}}" class="m-check-layerswitcher-addservices-wfs"> + <input type="checkbox" id="{{name}}" format="{{format}}" class="m-check-layerswitcher-addservices-wfs"> <label for="{{name}}" title="{{title}}">{{title}}</label> </td> </tr> diff --git a/api-idee-js/src/plugins/printviewmanagement/src/facade/assets/css/printviewmanagement.css b/api-idee-js/src/plugins/printviewmanagement/src/facade/assets/css/printviewmanagement.css index b9df10a45..075cb3233 100644 --- a/api-idee-js/src/plugins/printviewmanagement/src/facade/assets/css/printviewmanagement.css +++ b/api-idee-js/src/plugins/printviewmanagement/src/facade/assets/css/printviewmanagement.css @@ -25,7 +25,6 @@ justify-content: flex-start; } - #plugin-panel-printviewmanagement .button-container { width: 100%; display: flex; @@ -214,8 +213,6 @@ position: relative; overflow: auto; min-height: 300px; - /* display: flex; */ - /* flex-grow: 1; */ } .m-templateCustomizer-map-preview { diff --git a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/en.json b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/en.json index fb9de953a..ab40a418b 100644 --- a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/en.json +++ b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/en.json @@ -92,6 +92,7 @@ "vertical": "Vertical", "horizontal": "Horizontal", "scale": "Scale", + "scaleLine": "Scale Line", "dpi": "DPI (dots per inches)", "defaultText": "Enter text", "select_srs": "Select a reference system", diff --git a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/es.json b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/es.json index 1aadbb5ce..c131f5b97 100644 --- a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/es.json +++ b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/i18n/es.json @@ -92,6 +92,7 @@ "vertical": "Vertical", "horizontal": "Horizontal", "scale": "Escala", + "scaleLine": "Línea de escala", "dpi": "DPI (puntos por pulgadas)", "defaultText": "Introduzca texto", "select_srs": "Seleccione un sistema de referencia", diff --git a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/templateCustomizer.js b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/templateCustomizer.js index 4786fde49..128418868 100644 --- a/api-idee-js/src/plugins/printviewmanagement/src/facade/js/templateCustomizer.js +++ b/api-idee-js/src/plugins/printviewmanagement/src/facade/js/templateCustomizer.js @@ -8,6 +8,8 @@ import { PREVIEW_MAP_ORIENTATION } from '../../constants'; const ID_TEMPLATE_ORIENTATION = 'input[name="map-orientation"]'; const ID_TEMPLATE_LAYOUT = '#template-layout'; const ID_TEMPLATE_SCALE = '#template-scale'; +const SCALE_LINE_CONTROL_NAME = 'scaleline'; +const ID_TEMPLATE_SCALE_LINE = '#template-scale-line'; const ID_TEMPLATE_DPI = '#template-dpi'; const ID_TEMPLATE_INPUT_SRS = '#epsg-selected'; const ID_TEMPLATE_SRS_SELECTOR = '#m-customize-template-srs-selector'; @@ -155,9 +157,16 @@ export default class TemplateCustomizer extends IDEE.Control { * Escala inicial del mapa de previsualización * @private * @type {number|null} - */ + */ this.scale = null; + /** + * DPI seleccionado por defecto + * @private + * @type {number} + */ + this.dpi = this.dpiOptions_[0]; + /** * Conjunto de elementos principales que tiene la plantilla * @private @@ -222,6 +231,7 @@ export default class TemplateCustomizer extends IDEE.Control { horizontal: getValue('horizontal'), layout: getValue('layout'), scale: getValue('scale'), + scaleLine: getValue('scaleLine'), epsg: getValue('projection'), select_srs: getValue('select_srs'), choose_create_epsg: getValue('choose_create_epsg'), @@ -294,6 +304,7 @@ export default class TemplateCustomizer extends IDEE.Control { this.setupMapOrientationControl(ID_TEMPLATE_ORIENTATION); this.setupLayoutControl(ID_TEMPLATE_LAYOUT); this.setupScaleControl(ID_TEMPLATE_SCALE); + this.setupScaleLineControl(ID_TEMPLATE_SCALE_LINE); this.setupDpiControl(ID_TEMPLATE_DPI); this.setupInputSelectorControl(ID_TEMPLATE_INPUT_SRS, ID_TEMPLATE_SRS_SELECTOR); } @@ -327,6 +338,7 @@ export default class TemplateCustomizer extends IDEE.Control { this.templateElementsContainer_ = previewContainer; this.stylesApplied_ = false; this.setupViewScaleListener(); + this.setupScaleLineInput(); this.setupMapChangeListener(); this.applyTemplateStyles(); this.applyTemplateScripts(); @@ -354,6 +366,11 @@ export default class TemplateCustomizer extends IDEE.Control { } } + setupScaleLineInput() { + const { checked } = document.querySelector(ID_TEMPLATE_SCALE_LINE); + if (checked) this.previewMap.addControls(SCALE_LINE_CONTROL_NAME); + } + /** * Configura un listener para detectar cambios en el mapa (movimiento, zoom, EPSG, layout, etc.) */ @@ -702,6 +719,22 @@ export default class TemplateCustomizer extends IDEE.Control { }); } + /** + * Configura el control de escala lineal + * @param {string} scaleLineElementId - ID del elemento de entrada de escala lineal + */ + setupScaleLineControl(scaleLineElementId) { + /** + * @type {HTMLInputElement} + */ + const scaleElement = document.querySelector(scaleLineElementId); + scaleElement.addEventListener('click', (e) => { + const { checked } = e.target; + if (checked) this.previewMap.addControls(SCALE_LINE_CONTROL_NAME); + else this.previewMap.removeControls(SCALE_LINE_CONTROL_NAME); + }); + } + /** * Maneja el evento de cambio de escala al escribir en el campo de entrada * @param {Event} e - Evento de cambio en el campo de entrada de escala diff --git a/api-idee-js/src/plugins/printviewmanagement/src/templates/templateCustomizer.html b/api-idee-js/src/plugins/printviewmanagement/src/templates/templateCustomizer.html index 09d3ed549..42d09c118 100644 --- a/api-idee-js/src/plugins/printviewmanagement/src/templates/templateCustomizer.html +++ b/api-idee-js/src/plugins/printviewmanagement/src/templates/templateCustomizer.html @@ -4,10 +4,10 @@ <fieldset class="m-templateCustomizer-option template-option"> <legend>{{translations.mapElements}}</legend> {{#each templateElements}} - <label class="d-flex"> - <input type="checkbox" id="m-show-{{this.id}}" name="m-show-{{this.id}}" checked> - <span>{{this.label}}</span> - </label> + <label class="d-flex"> + <input type="checkbox" id="m-show-{{this.id}}" name="m-show-{{this.id}}" checked> + <span>{{this.label}}</span> + </label> {{/each}} </fieldset> @@ -27,7 +27,7 @@ <legend>{{translations.layout}}</legend> <select id="template-layout"> {{#each layoutOptions}} - <option value="{{this.value}}" {{#if default}} selected{{/if}}>{{this.label}}</option> + <option value="{{this.value}}" {{#if default}} selected{{/if}}>{{this.label}}</option> {{/each}} </select> </fieldset> @@ -35,27 +35,24 @@ <fieldset class="m-templateCustomizer-option template-scale"> <legend>{{translations.scale}}</legend> <input type="text" id="template-scale" value="1:{{defaultScale}}"> + + <label class="d-flex template-scale-line"> + <input type="checkbox" id="template-scale-line" name="m-show-scale-line" checked> + <span>{{translations.scaleLine}}</span> + </label> </fieldset> - + <fieldset class="m-templateCustomizer-option template-epsg"> <legend>{{translations.epsg}}</legend> <div class="m-customize-template-option m-customize-template-select-editable"> - <input - type="text" - id="epsg-selected" - class="m-templateCustomizer-input-srs" - name="epsg-selected" - value="{{defaultProjection}}" - aria-label="{{translations.select_srs}}" - title="{{translations.select_srs}}" - tabindex="{{order}}" - autocomplete="off" - readonly="readonly" - /> - <ul title="{{translations.select_srs}}" id="m-customize-template-srs-selector" class="m-templateCustomizer-srs-list"> + <input type="text" id="epsg-selected" class="m-templateCustomizer-input-srs" name="epsg-selected" + value="{{defaultProjection}}" aria-label="{{translations.select_srs}}" title="{{translations.select_srs}}" + tabindex="{{order}}" autocomplete="off" readonly="readonly" /> + <ul title="{{translations.select_srs}}" id="m-customize-template-srs-selector" + class="m-templateCustomizer-srs-list"> <li><a href="#" value="default" tabindex="-1" disabled>{{translations.choose_create_epsg}}</a></li> {{#each projectionsOptions}} - <li><a href="#" value="{{this.codes.[0]}}">{{this.codes.[0]}}</a></li> + <li><a href="#" value="{{this.codes.[0]}}">{{this.codes.[0]}}</a></li> {{/each}} </ul> </div> @@ -65,7 +62,7 @@ <legend>{{translations.dpi}}</legend> <select id="template-dpi"> {{#each dpiOptions}} - <option value="{{this}}" {{#if default}} selected{{/if}}>{{this}}</option> + <option value="{{this}}" {{#if default}} selected{{/if}}>{{this}}</option> {{/each}} </select> </fieldset> @@ -75,4 +72,4 @@ <div class="m-templateCustomizer-right-wrapper"> <div class="m-templateCustomizer-map-preview" id="m-customize-template-right"></div> </div> -</div> +</div> \ No newline at end of file diff --git a/api-idee-js/src/plugins/printviewmanagement/test/dev.html b/api-idee-js/src/plugins/printviewmanagement/test/dev.html index aeb00eafb..b9bc724c7 100644 --- a/api-idee-js/src/plugins/printviewmanagement/test/dev.html +++ b/api-idee-js/src/plugins/printviewmanagement/test/dev.html @@ -38,8 +38,7 @@ <input type="number" name="order" id="inputOrder" list="orderSug" value="-1"> </div> <div> - <label for="inputTooltip" - title="Texto que se muestra al dejar el ratón encima del plugin.">Título + <label for="inputTooltip" title="Texto que se muestra al dejar el ratón encima del plugin.">Título de la herramienta "tooltip"</label> <input type="text" name="tooltip" id="inputTooltip" list="tooltipSug"> <datalist id="tooltipSug"> @@ -48,7 +47,8 @@ </div> <div> <label for="inputDefaultOpenControl" - title="Índice del modo de impresión que aparecerá abierto al inicio: 0=ninguno, 1=printermap, 2=georefImage, 3=georefImageEpsg. Por defecto: 0">Modo por defecto "defaultOpenControl"</label> + title="Índice del modo de impresión que aparecerá abierto al inicio: 0=ninguno, 1=printermap, 2=georefImage, 3=georefImageEpsg. Por defecto: 0">Modo + por defecto "defaultOpenControl"</label> <input type="number" id="inputDefaultOpenControl" value="0" min="0" max="3" step="1"> </div> <div> @@ -57,7 +57,9 @@ "georefImageEpsg"</label> <input type="text" id="inputGeorefImageEpsg" list="georefImageEpsgSug"> <datalist id="georefImageEpsgSug"> - <option value='{"tooltip":"Georeferenciar imagen predefinida","layers":[{"url":"http://www.ign.es/wms-inspire/mapa-raster?","name":"mtn_rasterizado","format":"image/jpeg","legend":"Mapa ETRS89 UTM"},{"url":"http://www.ign.es/wms-inspire/pnoa-ma?","name":"OI.OrthoimageCoverage","format":"image/jpeg","legend":"Imagen (PNOA) ETRS89 UTM"}],"defaultDpiOptions":[96,150,300]}'></option> + <option + value='{"tooltip":"Georeferenciar imagen predefinida","layers":[{"url":"http://www.ign.es/wms-inspire/mapa-raster?","name":"mtn_rasterizado","format":"image/jpeg","legend":"Mapa ETRS89 UTM"},{"url":"http://www.ign.es/wms-inspire/pnoa-ma?","name":"OI.OrthoimageCoverage","format":"image/jpeg","legend":"Imagen (PNOA) ETRS89 UTM"}],"defaultDpiOptions":[96,150,300]}'> + </option> </datalist> </div> <div> @@ -75,7 +77,9 @@ "printermap"</label> <input type="text" id="inputPrintermap" list="printermapSug"> <datalist id="printermapSug"> - <option value='{"tooltip":"Impresión del mapa","filterTemplates":["${api-idee.static_resources.url}/plantillas/html/mapaConMarco.html","${api-idee.static_resources.url}/plantillas/html/mapaConCabeceraYMarco.html","${api-idee.static_resources.url}/plantillas/html/mapaConPieYMarco.html"],"showDefaultTemplate":false,"defaultDpiOptions":[96,150,300],"layoutsRestraintFromDpi":["screensize","A0","A1","A2"]}'></option> + <option + value='{"tooltip":"Impresión del mapa","filterTemplates":["${api-idee.static_resources.url}/plantillas/html/mapaConMarco.html","${api-idee.static_resources.url}/plantillas/html/mapaConCabeceraYMarco.html","${api-idee.static_resources.url}/plantillas/html/mapaConPieYMarco.html"],"showDefaultTemplate":false,"defaultDpiOptions":[96,150,300],"layoutsRestraintFromDpi":["screensize","A0","A1","A2"]}'> + </option> </datalist> </div> </div> diff --git a/api-idee-js/src/plugins/vectorsmanagement/src/impl/ol/js/analysiscontrol.js b/api-idee-js/src/plugins/vectorsmanagement/src/impl/ol/js/analysiscontrol.js index ded24ab02..3e603f026 100644 --- a/api-idee-js/src/plugins/vectorsmanagement/src/impl/ol/js/analysiscontrol.js +++ b/api-idee-js/src/plugins/vectorsmanagement/src/impl/ol/js/analysiscontrol.js @@ -355,7 +355,9 @@ export default class Analysiscontrol extends IDEE.impl.Control { * @api */ getFeatureArea(feature) { - return feature.getImpl().getFeature().getGeometry().getArea(); + const codeProj = this.facadeMap_.getProjection().code; + const geometry = feature.getImpl().getFeature().getGeometry(); + return ol.sphere.getArea(geometry, { projection: codeProj }); } getGeometryLength(geometry) { @@ -432,13 +434,13 @@ export default class Analysiscontrol extends IDEE.impl.Control { return features.map((featureFacade) => { const feature = featureFacade.getImpl().getFeature(); - const area = ol.sphere.getArea(feature.getGeometry()); + const area = ol.sphere.getArea(feature.getGeometry(), { projection: src }); feature.getGeometry().transform(src, 'EPSG:3857'); const featureJSON = geoFormat.writeFeatureObject(feature); featureJSON.properties = { area: { - km: area / (10 ** 6), - m: area, + km2: area / (10 ** 6), + m2: area, }, }; diff --git a/api-idee-js/src/templates/rotateCesium.html b/api-idee-js/src/templates/rotateCesium.html index 18510e4b9..a564a99a0 100644 --- a/api-idee-js/src/templates/rotateCesium.html +++ b/api-idee-js/src/templates/rotateCesium.html @@ -36,7 +36,7 @@ <h3 tabindex="{{order}}">{{title_help_container}}</h3> <div class="m-rotate-help-section"> <div class="m-rotate-help-option" tabindex="{{order}}"> <div> - <img class="m-rotate-dot" src="../facade/assets/images/girar-vista.svg" alt="{{image1_description}}"> + <img class="m-rotate-dot" src="https://componentes.idee.es/estaticos/Simbologia/svg/icons_cota/rotate-girar-vista.svg" alt="{{image1_description}}"> </div> <div> <b>{{title1}}</b> @@ -45,7 +45,7 @@ <h3 tabindex="{{order}}">{{title_help_container}}</h3> </div> <div class="m-rotate-help-option" tabindex="{{order}}"> <div> - <img class="m-rotate-dot" src="../facade/assets/images/inclinar-vista.svg" alt="{{image2_description}}"> + <img class="m-rotate-dot" src="https://componentes.idee.es/estaticos/Simbologia/svg/icons_cota/rotate-inclinar-vista.svg" alt="{{image2_description}}"> </div> <div> <b>{{title2}}</b> diff --git a/api-idee-js/test/development/CP-0003-controls/CP-006.js b/api-idee-js/test/development/CP-0003-controls/CP-006.js index e55a3bd01..09b1710f5 100644 --- a/api-idee-js/test/development/CP-0003-controls/CP-006.js +++ b/api-idee-js/test/development/CP-0003-controls/CP-006.js @@ -4,8 +4,7 @@ import Location from 'IDEE/control/Location'; const map = Mmap({ container: 'map', projection: 'EPSG:3857', - controls: ['rotate'], - // controls: ['location*true*false'], + controls: ['location', 'implementationswitcher'], center: [-443273.10081370454, 4757481.749296248], zoom: 6, }); diff --git a/api-idee-js/test/development/CP-0003-controls/CP-007.js b/api-idee-js/test/development/CP-0003-controls/CP-007.js index d1c893fed..a6044e821 100644 --- a/api-idee-js/test/development/CP-0003-controls/CP-007.js +++ b/api-idee-js/test/development/CP-0003-controls/CP-007.js @@ -3,7 +3,7 @@ import { map as Mmap } from 'IDEE/api-idee'; const mapa = Mmap({ container: 'map', projection: 'EPSG:3857', - controls: ['location*false*true'], + controls: ['locator'], center: [-443273.10081370454, 4757481.749296248], zoom: 6, }); diff --git a/api-idee-js/test/development/CP-0003-controls/README.md b/api-idee-js/test/development/CP-0003-controls/README.md index 6ffcd85f9..251d908e4 100644 --- a/api-idee-js/test/development/CP-0003-controls/README.md +++ b/api-idee-js/test/development/CP-0003-controls/README.md @@ -14,13 +14,13 @@ CP-005 Control getfeatureinfo*false CP-006 -Control location*true*false +Control rotate CP-007 -Control location*false*true +Control location CP-008 -Control rotation (se prueba añadiéndolo en un Plugin para el verificado de que los contenedores se guardan correctamente) +Control rotate (se prueba añadiéndolo en un Plugin para el verificado de que los contenedores se guardan correctamente) CP-009 Control attributions diff --git a/api-idee-rest/src/main/webapp/infocoordinates.jsp b/api-idee-rest/src/main/webapp/infocoordinates.jsp index 10c98d65c..79ff35a13 100644 --- a/api-idee-rest/src/main/webapp/infocoordinates.jsp +++ b/api-idee-rest/src/main/webapp/infocoordinates.jsp @@ -81,6 +81,13 @@ <option value="csv">csv</option> </select> </div> + <div> + <label for="inputEpsgResults" title="Códigos EPSG separados por comas para mostrar simultáneamente. Si es nulo se utiliza por defecto el EPSG del mapa y se muestra el selector CRS. Por defecto nulo">Resultados multi-EPSG "epsgResults"</label> + <input type="text" name="epsgResults" id="inputEpsgResults" list="epsgResultsSug"> + <datalist id="epsgResultsSug"> + <option value="25831,4326,4258,3857"></option> + </datalist> + </div> </div> <div class="m-test-buttons"> <button name="eliminar" class="m-test-button" id="botonEliminar">Eliminar Plugin</button> @@ -124,6 +131,7 @@ const inputDecimalGEOcoord = document.getElementById('inputDecimalGEOcoord'); const inputDecimalUTMcoord = document.getElementById('inputDecimalUTMcoord'); const selectOutputDownloadFormat = document.getElementById('selectOutputDownloadFormat'); + const inputEpsgResults = document.getElementById('inputEpsgResults'); const botonEliminar = document.getElementById('botonEliminar'); [ @@ -135,6 +143,7 @@ inputDecimalGEOcoord, inputDecimalUTMcoord, selectOutputDownloadFormat, + inputEpsgResults, ].forEach((ctrl) => ctrl.addEventListener('change', cambiarTest)); botonEliminar.addEventListener('click', function () { @@ -151,6 +160,7 @@ objeto.decimalGEOcoord = Number(inputDecimalGEOcoord.value); objeto.decimalUTMcoord = Number(inputDecimalUTMcoord.value); objeto.outputDownloadFormat = selectOutputDownloadFormat.options[selectOutputDownloadFormat.selectedIndex].value; + objeto.epsgResults = inputEpsgResults.value; if (mp !== null) map.removePlugins(mp); crearPlugin(objeto); diff --git a/api-idee-rest/src/main/webapp/locator.jsp b/api-idee-rest/src/main/webapp/locator.jsp index acaa7e39d..cc6406d46 100644 --- a/api-idee-rest/src/main/webapp/locator.jsp +++ b/api-idee-rest/src/main/webapp/locator.jsp @@ -137,7 +137,7 @@ IDEE.language.setLang(urlParams.get('language') || 'es'); const map = IDEE.map({ container: 'mapjs', - controls: ['rotate'], + controls: ['implementationswitcher'], zoom: 5, maxZoom: 20, minZoom: 4,
${getValue('point')} ${i + 1}
X: ${this.formatUTMCoordinate(varUTM[0])}
Y: ${this.formatUTMCoordinate(varUTM[1])}${getValue('point')} ${idx + 1}
${getValue('altitude')} ${altitude}