Web app for visualisation of modelling and results from the Land Use Demonstrator project. See:
- The Geospatial Commission's blog post about the project
- A page on the Alan Turing Institute's intranet, Mathison, about the project.
https://Urban-Analytics-Technology-Platform.github.io/demoland-web
The dev branch can be previewed at https://Urban-Analytics-Technology-Platform.github.io/demoland-web/dev.
(This is not guaranteed to always be functional!)
The easiest way is probably using Docker:
git clone [email protected]:Urban-Analytics-Technology-Platform/demoland-web.git
cd demoland-web
docker build -t demoland_web .
docker run -p 80:80 demoland_web
Then, navigate to http://localhost in your browser.
npm run dev
For rapid prototyping and feature development, it's recommended to use Vite:
git clone [email protected]:Urban-Analytics-Technology-Platform/demoland-web.git
cd demoland-web
npm install
npm run dev # this invokes Vite
Note that npm run dev only allows you to set up the app for one area at a time.
Without any arguments, the default area of tyne_and_wear will be used.
You can specify which area to work on by running npm run dev [AREA_NAME].
The valid values for [AREA_NAME] are the subdirectories of the /areas folder.
Vite's HMR functionality means that the website you see is updated any time any of the files change.
However, note that if you change files inside the /areas folder (e.g. by adding a new scenario), it will not reload automatically: you will have to restart the server to see the changes live.
npm run build
To build the project for one specific area, use:
npm run build local [AREA_NAME]
(again, if unspecified, [AREA_NAME] defaults to tyne_and_wear.)
The build output is placed inside /dist. You can then run
npm run preview
to launch a HTTP server from this directory on port 4173. You can then open http://localhost:4173/[AREA_NAME] in your browser.
Note that the build procedure is set up such that the website root (i.e. http://localhost:4173) redirects to the default area, i.e. http://localhost:4173/tyne_and_wear.
If you have not built the files for tyne_and_wear before then this will give you a 404 error, which can be fixed by running npm run build local tyne_and_wear.
npm run build_all
To build the files for all areas at once (which is probably the more helpful option, unless you're specifically debugging issues with one area), use:
npm run build_all local
You can then again use npm run preview, like above.
See CUSTOM_AREA.md.
This web app is powered by two other repositories:
- demoland-project contains the modelling work which is responsible for the predicted indicator values, as well as a book discussing the project methodology and developer notes for the web app.
- demoland-engine is a self-contained package which hosts the final trained models, as well as a REST API which is used for the custom scenario prediction backend.