Cart Licenses Contact Support Online Creator Login/Register
Try
Buy
v 1.9.32

Localized analytics summary view

SurveyJS Analytics seamless uses all used locales from the survey if you pass it in options. You user will see results in their native language.


                        
        
            Survey.StylesManager.applyTheme("defaultV2");
        


        
            var json = {
  "locale": "fr",
  "elements": [
    {
      "type": "dropdown",
      "name": "satisfaction",
      "title": {
        "default": "How satisfied are you with the Product?",
        "ru": "Насколько Вас устраивает наш продукт?",
        "fr": "Êtes-vous satisfait du produit?"
      },
      "choices": [
        {
          "value": 0,
          "text": {
            "default": "Not Satisfied",
            "ru": "Coвсем не устраивает",
            "fr": "Pas satisfait"
          }
        },
        {
          "value": 1,
          "text": {
            "default": "Satisfied",
            "ru": "Устраивает",
            "fr": "Satisfait"
          }
        },
        {
          "value": 2,
          "text": {
            "default": "Completely satisfied",
            "ru": "Полностью устраивает",
            "fr": "Complètement satisfait"
          }
        }
      ]
    }
  ]
};
        

var survey = new Survey.Model(json);
var allQuestions = survey.getAllQuestions();

function randomIntFromInterval(min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}

var data = [];

// We show random data in this example
for (let index = 0; index < 10; index++) {
  data.push({
    satisfaction: randomIntFromInterval(0, 2),
  });
}

var visPanel = new SurveyAnalytics.VisualizationPanel(
    allQuestions,
    data,
    {labelTruncateLength: 27, survey: survey}
);
visPanel.showHeader = true;
visPanel.render(surveyResult);

                    
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Localized analytics summary view, Reactjs Survey Library Example</title>
    
<meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/jquery"></script>
    <script src="https://unpkg.com/react@17.0.1/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/react-dom@17.0.1/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/@babel/standalone@7.2.5/babel.min.js"></script>
    <script src="/DevBuilds/survey-core/survey.core.min.js"></script>
    <script src="/DevBuilds/survey-core/survey.i18n.min.js"></script>
    <script src="/DevBuilds/survey-react-ui/survey-react-ui.min.js"></script>
    <link href="/DevBuilds/survey-core/defaultV2.min.css" type="text/css" rel="stylesheet" />
    <link rel="stylesheet" href="./index.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://cdn.plot.ly/plotly-latest.min.js"></script>

<script src="https://unpkg.com/wordcloud@1.1.0/src/wordcloud2.js"></script>        <link href="/DevBuilds/survey-analytics/survey.analytics.min.css" rel="stylesheet" />
        <script src="/DevBuilds/survey-analytics/survey.analytics.min.js"></script>

</head>
<body>
    
<div>

</div>            <div id="surveyElement" style="display:inline-block;width:100%;">
            </div>
    <div id="surveyResult"></div>

<script type="text/babel" src="./index.js"></script>

</body>
</html>
; ; ;