Displays an integer from zero to five as a rate through colored icons.
Transforms the input value (integer 0-5) into a series of colored icons.
Filter Variants
The set of predefined filter variants that can be used to format values.
| fiveCirclesRating | |
|---|---|
| Displays five circles and fills the first ones according to the given integer number (0-5). Supported Input Types: INTEGER | FLOAT | NUMBER Output Type: HTML |
|
| fiveHeartsRating | |
|---|---|
| Displays five hearts and fills the first ones according to the given integer number (0-5). Supported Input Types: INTEGER | FLOAT | NUMBER Output Type: HTML |
|
| fiveStarsRating | |
|---|---|
| Displays five stars and fills the first ones according to the given integer number (0-5). Supported Input Types: INTEGER | FLOAT | NUMBER Output Type: HTML |
|
Configuration Options
New variants can be defined through the following configuration options.
| Option | Description | Sample Value |
|---|---|---|
| fillIcon | The Font Awesome icon to be displayed at firsts. | fas fa-star |
| emptyIcon | The Font Awesome icon to be displayed at lasts. | far fa-star |
| color | The color class or hexadecimal color of the icons. | text-green, #e31b23 |
Example of defining a custom ratings filter variant:
exports.fiveStarts = RatingFormatter({ "fillIcon": "fas fa-start", "emptyIcon": "far fa-start", "color": "text-yellow" });
Comments
0 comments
Please sign in to leave a comment.