-
Xiao Gui authored1c6dc299
Interactive Atlas Viewer
Interactive Atlas Viewer is an frontend module wrapping around nehuba. It provides additional features, such as metadata integration, data visualisation and a robust plugin system.
Getting Started
A live version of the Interactive Atlas Viewer is available at https://kg.humanbrainproject.org/viewer/. This section is useful for developers who would like to develop this project.
General information
Interactive atlas viewer is built with Angular (v6.0), Bootstrap (v4), and fontawesome icons. Some other notable packages used are: ng2-charts for charts visualisation, ngx-bootstrap for UI and ngrx/store for state management.
Releases newer than v0.2.9 also uses a nodejs backend, which uses passportjs for user authentication, express as a http framework.
Prerequisites
- node > 6
- npm > 4
Develop Interactive Viewer
To run a dev server, run:
$ git clone https://github.com/HumanBrainProject/interactive-viewer
$ cd interactive-viewer
$ npm i
$ npm run dev
Develop Plugins
For releases newer than v0.2.9, Interactive Atlas Viewer attempts to fetch GET {BACKEND_URL}/plugins
to retrieve a list of URLs. The interactive atlas viewer will then perform a GET
request for each of the listed URLs, parsing them as manifests.
The backend reads the environment variable PLUGIN_URLS
and separate the string with ;
as a delimiter. In order to return a response akin to the following:
["http://localhost:3001/manifest.json","http://localhost:9001/manifest.json"]
Plugin developers may choose to do any of the following:
shell
set env var every time
$ PLUGIN_URLS=http://localhost:3001/manifest.json;http://localhost:9001/manifest.json npm run dev
dotenv
set a .env
file in ./deploy/
once
$ echo `PLUGIN_URLS=http://localhost:3001/manifest.json;http://localhost:9001/manifest.json` > ./deploy/.env
then, simple start the dev process with
$ npm run dev
Plugin developers can start their own webserver, use interactive-viewer-plugin-template, or (coming soon) provide link to a github repository.
Compilation
package.json
provide with two ways of building the interactive atlas viewer, JIT
or AOT
compilation. In general, AOT
compilation produces a smaller package and has better performance.
AOT compilation
npm run build-aot
JIT Compilation
npm run build
/* OR */
npm run build-min
Docker
The repository also provides a Dockerfile
. Here are the environment variables used:
build time
-
BACKEND_URL : same as
HOSTNAME
during run time. Needed as root URL when fetching templates / datasets etc. If left empty, will fetch without hostname.
run time
- SESSION_SECRET : needed for session
- HOSTNAME : needed for OIDC redirect
- HBP_CLIENTID : neded for OIDC authentication
- HBP_CLIENTSECRET : needed for OIDC authentication
- PLUGIN_URLS : optional. Allows plugins to be populated
- REFRESH_TOKEN : needed for access of public data
Contributing
Feel free to raise an issue in this repo and/or file a PR.
Versioning
Commit history prior to v0.2.0 is available in the legacy-v0.2.0 branch. The repo was rewritten to remove its dependency on neuroglancer and nehuba. This allowed for simpler webpack config, faster build time and AOT compilation.
License
TO BE DECIDED