Visualize Survey Data from SurveyJS Service

SurveyJS provides a free service that allows you to create surveys and forms, store their JSON schemas in our database, and collect results from your respondents. This example shows how you can use the Dashboard library to visualize survey data collected through the service.

SurveyJS Service is meant as a demonstration of what you can build with SurveyJS products. SurveyJS assumes no responsibility for any consequence of misusing or violating any sensitive data communicated via the service. In real-world applications, we strongly recommend storing survey results and JSON schemas in your own database.

To configure SurveyJS Dashboard for work with SurveyJS Service, follow the steps below:

1. Create a survey instance.
   Make sure that your survey JSON schema is configured for saving results in the SurveyJS storage. To create a survey instance, pass the JSON schema with a specified surveyId property to the Model constructor.

2. Fetch survey results from SurveyJS Service.
   SurveyJS Service exposes multiple public and private API endpoints. To fetch survey results, make a request to the getSurveyPublicResults API. Append your survey ID to the endpoint URL (see the dataurl.js file in code).

3. Create and render a Visualization Panel.
   Add a <div> element with an id attribute to your page. To instantiate a Visualization Panel, pass survey questions, survey results from step 2, and optional settings to the VisualizationPanel constructor. Call the render(containerId) method on the instance to render the Visualization Panel in the div element.