Skip to content

Rating

rating

Description

Simplified range used for a rating generally 0-5 or 1-10.

Attributes

  • minimum
  • maximum
  • multipleOf: display increment within a slider by default 1
  • $capture.icons: [Array of string optional]. Provide an icons to display below the line
  • $capture.marks: "true" | "false". Show marks on the line
  • $capture.markLabel: "auto"|"on"|"off".Show label bubble
  • $capture.floatingLabel: "auto"|"on"|"off".Show a dynamic label with current value
  • $capture.defaultDot: "auto"|"on"|"off". Show dot for initial item or not.
  • $capture.onClick: array matching enum that contains corresponding values when clicked or null to ignore, if not provided the clicks will not perform any action
  • default: Provide a default value for slider.
  • enum: labels to display; they will be spaced evenly and do not need to match the full range.

Example

{
  "type": "integer",
  "title": "How do you feel?",
  "$capture": {
    "as": "rating",
    "icons": [
      "fal fa-frown-open",
      "fal fa-frown",
      "fal fa-meh",
      "fal fa-grin-beam"
    ]
  },
  "default": 3,
  "minimum": 1,
  "maximum": 8
}

Example 2

{
  "type": "integer",
  "title": "test?",
  "description": "",
  "$capture": {
    "as": "rating",
    "icons": [
      "fal fa-dizzy",
      "fal fa-frown",
      "fal fa-meh",
      "fal fa-grin",
      "fal fa-grin-beam"
    ],
    "marks": false,
    "default": 50,
    "floatingLabel": "auto",
    "markLabel": "on"
  },
  "$display": {
    "as": "chart",
    "component": "progress",
    "format": "0.0",
    "max": 100,
    "color": "redgreen",
    "show": "value",
    "raw": true
  },
  "minimum": 0,
  "maximum": 100,
  "multipleOf": 25
}