Survalyzer offers customers the ability to create their own Dashboard solutions. These Dashboards can either be hosted on the Survalyzer infrastructure: clients.survalyzer.com, or on another other hosting platform.
Frameworks and Libraries
To be able to support such custom Dashboards it’s essential to have a unified technology stack. Survalyzer provides guidance in terms of libraries and frameworks to be used. These are:
- Bootstrap (https://getbootstrap.com/) as a CSS Framwork
- Angular (https://angular.io/) Single Page Application Framework
- JQuery (https://jquery.com/) for DOM handling
- Underscore (https://underscorejs.org/) for data-binding
- WebL10n (https://github.com/fabi1cazenave/webL10n) for multilanguage
- Highcharts (https://www.highcharts.com/) for charting and visualization
- jStat (https://jstat.github.io/vector.html) for statistical calculations like median and quartiles
Survalyzer provides a solution template with the basic setup as a starting point. This template can be downloaded here.
Approach
The general idea of custom Dashboards is to a create lightweight, high-end data visualisation UI, using the Survalyzer survey data through it’s public API. For the sake of simplicity, the chosen approach is a Single Page Application with a responsive design and the very powerful visualisation library – Highcharts.
The first step to create a custom Dashboard after downloading the template is to retrieve data. This is described in the following article: http://education.survalyzer.com/knowledge-base/api-usage-introduction/
Data access rights
Data received from the API is dependent on user rights. The following accessibility applies:
- Survalyzer Admin
- All survey data
- Survalyzer User
- Survey data for the workspace they have access to
- Panel Member
- Survey data to which they have granted rights by the report viewer
The format in which the survey data is retrieved can be found here.
Custom hosting
If the custom Dashboard is hosted somewhere other than clients.survalyzer.com, this domain has to be added to Survalyzers CORS configuration, to allow cross origin API calls. Clients.survalyzer.com has granted CORS access per default. Customers can also alias the address clients.survalyzer.com with a custom domain.
Local development
Usually, development servers are running on http://localhost. When using the API from here, a CORS error message will be returned. To fix this issue, a local proxy is needed. Survalyzer offers such a proxy to be used for development purposes. It can be downloaded here. The proxy doesn’t need to be installed but needs the .NET Core 2.1 Framework to be installed on the computer. Start the local proxy by running the startup.cmd.
To use the proxy prefix, the API calls with “http://localhost:5000/api/Proxy?targetUrl=”.
Prior to the deployment to production, please make sure that the prefix is removed.