Rutes GPS Joanillo

De wikijoan
Salta a la navegació Salta a la cerca

Introducció

Aquesta és l'aplicació web que des de fa anys està funcionant a:

I ha anat evolucionant.

Versions

v1 fins a v5

Rutesgps v5.png

Aquestes són les diferents versions que s'han anat succeïnt fins el maig de 2021. Funciona amb la llibreria leaflet, i funciona amb classic scripts (en comptes de export/import modules). I sense bootstrap. També utilitza PHP per tal de parsejar els fitxers GPX i obtenir la informació dels fitxers.

A partir de la versió v4 tinc la carpeta nodejs/ per generar estadístiques i per generar cronoescalades. A partir d'aquesta versió utilitzo el tag <metadata><desc>...</desc></metadata> per posar la informació de les rutes.

En la última versió v5 s'han sobreposat el perfil de les etapes (amb la llibreria 3d.js). Aquesta versió és la que ha estat pública fins el juny de 2021.

v6

No és una versió de l'aplicació. Senzillament és la plantilla basada en bootstrap per tal de sentar les bases de la nova aplicació.

A part del nou disseny (accordion_v4.html), començo a treballar en tota la part de front-end.

Utilitzo el script generar_array_rutes.py per tal de parsejar les rutes gpx i generar els scripts js_btt/llista_modalitats.js i js_btt/llista_rutes.js. I també tinc el script js_btt/main.js que ho fa funcionar tot.

Ja tinc la navegació bàsica del menú lateral esquerra: puc veure les diferents zones (Bagà, Sant Feliu,...) i desplegar les rutes dins de cada zona. També tinc el check box de senderisme i btt. Tot automatitzat a partir de la informació que hi ha en les rutes GPX.

I ja és Openlayers (mapa bàsic d'exemple). Però encara no funciona per mòduls.

v7

Rutesgps v7.png

A partir de la versió v7 el desenvolupament es fa amb:

  • dins de la carpeta rutesgpsapp
  • npm start
  • javascript modules export/import
  • llibreria openlayers
  • github

Comentaris i problemes que he tingut:

$ npm run build

> rutesgpsapp@1.0.0 build
> parcel build --public-url . index.html

/home/joan/rutesgps/rutesgpsapp/index.html: tree.render is not a function

Hi, jjy. I faced same problem. For not blocked here, I found a way.

parcel build --no-minify index.html

Per tant, en el package.json posem:

    "build": "parcel build --no-minify --public-url . index.html"

que fa que els diferents scripts no quedin minimitzats. I a part d'això, se soluciona el problema.

Una altra cosa és que en el fitxer package.json crec que no importa què posem a:

  "main": "index.html",

(abans tenia index.js o main.js). El que importa és el que s'executa quan faig en npm start:

"start": "parcel index.html",

I a dins del index.html tinc la inclusió del main.js:

<script src="./js_btt/main.js"></script>

A partir del main.js ara ja tot funciona per mòduls.

En la v7 només vull que el que em funcionava en el v6 amb l'anterior paradigma, ara em funcioni bé amb el nou paradigma de export/import, però de moment només vull pintar un mapa base senzill. Pintar tots els mapes de les meves rutes ho deixo per la versió v8.

Bootstrap

He intentat utilitzar bootstrap com a mòdul, però de moment no m'ha funcionat:

npm install bootstrap
* a main, js: import * as bootstrap from 'bootstrap';
*a index.html, eliminar les referències de bootstrap

creat per Joan Quintana Compte, maig 2021