Charts in report editor

Charts in report editor

Currently, the Effect IO report editor is in its infancy, so setting up charts requires some work.
After you have created a report, you can navigate to a page, and add the "chart" component. Here, you will be able to the JSON configuration of a chart. An example of valid JSON is added below.

Effect IO uses Highcharts as charting engine, so you'll be able to find every kind of chart to add to report here https://highcharts.com/demo

Questions or need help setting up a chart? Click chat-button and we will help out!

  1. {
  2.           "title": {
  3.               "en": "bar example"
  4.           },
  5.           "highcharts": {
  6.               "chart": {
  7.                   "type": "bar",
  8.                   "inverted": "true",
  9. "height": "400"
  10.               },
  11.               "title": {
  12.                   "text": "Test"
  13.               },
  14.               "yAxis": {
  15.                   "max": "6",
  16.                   "title": {
  17.                       "align": "'high'"
  18.                   }
  19.               },
  20.               "xAxis": {
  21. "categories": [
  22.             "Jan",
  23.             "Feb"
  24. ]
  25. },
  26.               "plotOptions": {
  27.                   "column": {
  28.                       "stacking": "'normal'",
  29.                       "borderRadius": "5"
  30.                   },
  31.                   "legend": {
  32.                       "enabled": "true",
  33.                       "reversed": "true",
  34.                       "borderColor": "false",
  35.                       "verticalAlign": "'top'",
  36.                       "backgroundColor": "true"
  37.                   }
  38.               }
  39.           },
  40.           "fn": {
  41.               "questionIds": [
  42.                   "gridQ1",
  43.                   "gridQ2"
  44.               ],
  45.               "type": "Avg"
  46.           },
  47.           "js": "function(obj) { obj.series[0].type = \"line\"; console.log(obj); return obj; }"
  48.       }

    • Related Articles

    • Report variables

      High level of technical difficulty In the report it is possible to refer to average values of a question or variable within texts. This has the following format: {{seriesID.questionID}} Example ...

    • Working with surveys

      The Effect IO survey editor is the core of the system. A general overview on how to work with surveys follows. We assume that you have created a new survey and have entered the survey editor. You can also learn more about survey settings here. About ...

    • Benchmarks

      It is possible to create two types of benchmarks in Effect IO. These are set as part of survey settings. The two types are Range benchmark: Allows 2-X values that will be represented as "background" in the charts Single value benchmark: Set one ...

    • About survey topics and topic groups

      A unique feature for the Effect IO software is how surveys and reports pages are defined as part of topics and topic groups. Topics and topic groups exists for multiple reasons. One of the reasons is that we really like standardization as it helps in ...

    • Add item numbers

      The default design does not show numbers to blocks. Here is a guide on how to add this. 1: Add item number in survey editor to a block. 2: As tenant admin, go to "Surveys"->"Designs". Create a new design or adjust an existing one where you add this ...