RatingMenu widget is not working with float values

I have implemented ratingMenu widget in Angular.

When I can click on any option from ratingMenu,

  • it only shows results with rounded value like 3, 4 or 5.
  • It is not showing any results with float values like 4.9, 4.6 etc.

Result list before clicking on Rating filter

Result list after clicking on Rating filter

People have mentioned about similar problem on past but no solution provided yet: Use a float for the rating in Vue InstantSearch - #4 by alex8

Algolia team please provide support for float values in the ratingMenu. the solution mentioned on here is not viable for thousands of records.

Hi Keyul,
When you say " the solution mentioned on here is not viable for thousands of records." I am assuming you mean adding an additional field with rounded values.

I am curious as to why this would not be viable for thousands of records. If you are using a script to round / index an additional field, the number of records should not be a big issue. A single additional attribute with one integer value should not increase the record size very much so it shouldn’t have an impact on performance.

Hi Maria,

It’s not about record size. To add this one extra field in thousands of the records, developer need to convert

  1. all the values in required format
  2. Update all the records

This takes lots of hours and extra work for developers. Also, it increases operation cost in Algolia account as all records need to be updated.

Hi Keyul,
Sorry if my response wasn’t clear. What I meant is if you use a script to add an additional field, or already build it into your indexing script, it should not take as long as if you were to manually convert each value.

One way of doing this is to use a browse function to pull your current records and send a partial update with the additional field. A very quick rough version could look like this in JS:

const algoliasearch = require('algoliasearch')
const client = algoliasearch('yourAppId', 'yourApiKey');
const index = client.initIndex('yourIndexName')

const browser = index.browseAll();

browser.on('result', content => {
    // create updates which include the objectID and a rounded version of the "rating" attribute
    let updates = content.hits.map(hit => {
        return Object.assign({}, {objectID: hit.objectID, integerRating: Math.floor(hit.rating)})

browser.on('end', () => {

browser.on('error', err => {
  throw err;

Of course, a better way would be simply to build something like this into your indexing script that would add the additional value whenever your objects are indexed.

It’s true it would be better to support floats out of the box, which is why I’ve filed an issue here: Support float values in <ais-rating-menu> · Issue #715 · algolia/vue-instantsearch · GitHub, but the workaround provided will work until that is solved.

1 Like