Analytics Library for SurveyJS

SurveyJS Analytics library allows to render survey results
as charts or tables

Features

• Count answers and render results as charts for the select type questions
• Count answers and render results as gauge for range type question
• Three different types of charts: bar, pie and line
• Wordcloud for text questions representation
• Interactive filtering for the select type questions
• Flexible layout and customizable colors

Screenshots

Usage (modern ES, modules)

Usage (ES5, scripts)

Add these scripts to your web page

    <link rel="stylesheet" type="text/css" href="../packages/survey.analytics.css" />

    <script src="https://cdn.rawgit.com/inexorabletash/polyfill/master/typedarray.js"></script>

    <script src="https://polyfill.io/v3/polyfill.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>

    <link rel="stylesheet" type="text/css" href="https://unpkg.com/c3@0.7.1/c3.css" />

    <script src="https://unpkg.com/d3@5.9.2/dist/d3.min.js"></script>
    <script src="https://unpkg.com/c3@0.7.1/c3.js"></script>

    <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>

    <script src="https://unpkg.com/wordcloud@1.1.0/src/wordcloud2.js"></script>

    <script src="../node_modules/survey-core/survey.core.js"></script>
    <script src="../packages/survey.analytics.js"></script>

var surveyId = "your survey Id";
var accessKey = "your access key";

var survey = new Survey.SurveyModel({ surveyId: surveyId });

var xhr = new XMLHttpRequest();
xhr.open(
  "GET",
  "http://surveyjs.io/api/MySurveys/getSurveyResults/" +
    surveyId +
    "?accessKey=" +
    accessKey
);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onload = function() {
  var result = xhr.response ? JSON.parse(xhr.response) : [];

  var normalizedData = result.Data.map(function(item) {
    survey.getAllQuestions().forEach(function(q) {
      if (item[q.name] === undefined) {
        item[q.name] = "";
      }
    });
    return item;
  });

  var visPanel = new SurveyAnalytics.VisualizationPanel(
    document.getElementById("summaryContainer"),
    survey.getAllQuestions(),
    normalizedData
  );
  visPanel.showHeader = true;
  visPanel.render();
};
xhr.send();

Please check the following setting in your "tsconfig.json" file (this setting is need for used charting library):

    "module": "es2015",

Examples

• NPS survey results summary
• NPS survey results summary (new)

Constraints

• Wisualization for custom widgets is not implemented

License

Commercial