ExplorViz uses dynamic analysis techniques to provide live trace visualization of the communication in large software landscape. It targets system and program comprehension in those landscapes while still providing details on the communication within an application. A landscape perspective enriches current system visualizations with additional abstraction levels for efficient comprehension of communication between hundreds of applications which is often encountered in, for instance, Cloud environments. On the application level perspective, ExplorViz utilizes the 3D city metaphor combined with an interactive concept of showing only details that are in focus of the analysis. For best accessibility, ExplorViz is a web-based tool featuring cutting-edge technologies like WebGL and HTML 5.
Given the 3D city metaphor visualization of an application, we investigate new interaction styles and higher immersion for a more effective and efficient program comprehension process. For this purpose, we utilize uprising technologies and evaluate developed approaches in experiments with real test subjects.
The usability and effectiveness of ExplorViz has been investigated in controlled experiments which resulted in increased efficiency and effectiveness over competing approaches.
This project is a WIP replica of ExplorViz's visualization component. It substitutes GWT client-code with EmberJS. This is only the frontend, you will need the backend as well for production.
Citing ExplorViz as a tool:
Florian Fittkau, Alexander Krause, Wilhelm Hasselbring (2017): Software landscape and application visualization for system comprehension with ExplorViz. Information and Software Technology, Volume 87. pp. 259-277. DOI https://doi.org/10.1016/j.infsof.2016.07.004.
Citing ExplorViz' collaborative modularization process:
Zirkelbach, Christian, Krause, Alexander and Hasselbring, Wilhelm (2019): Modularization of Research Software for Collaborative Open Source Development. In Proceedings of the Ninth International Conference on Advanced Collaborative Networks, Systems and Applications (COLLA 2019), June 30 - July 04, 2019, Rome, Italy.
The API documentation is available here.
Use our Docker images as described in our Wiki.
You will need the following things properly installed on your computer.
git clone <repository-url>
this repositorycd frontend
npm install -g ember-cli
npm install
- Generate a SSL certificate and place the
server.key
andserver.crt
files in the.ssl
directory. - Unless the backend is running on
localhost
, specify the backend's base URL in theAPI_ROOT
environment variable. ember serve
orember s
- Visit the frontend at https://localhost:4200.
For development, we suggest using VSCode. Installing the following extensions will help you stick to our code-styling rules and other best practices.
You can also run the code analysis within you terminal with:
npm run lint
(.js, .ts, .hbs),npm run lint:eslint
(.js, .ts), ornpm run lint:template
(.hbs)
npm test
orember test
/ember test --server
npm build
orember build
(development) /ember build --environment=production
(production)