Geosearch help: insideBoundingBox problem

Hello guys,

I am having an issue I don’t know how to fix. So, the basic idea is I have a database of courses. Those courses can be held in a city or can be “virtual”, so anyone in the world can attend those online.

I am using instantsearch.js

On the courses page I have an filter to search only courses in Toronto, Canada for example. I am settings the latitude and lognitude and searching all courses from that city with 100km radius. This worked, but the client wants to display the “virtual” courses too when geofiltering is on.

I tried to play with insideBoundingBox parameter but don’t know how to do that.

So the basic idea is that virtual courses have 0.000000000 for longitude and latitude. I wanted to include those with lat&long 0.000000000 in the geofilter.

Any idea on how to do that?

Hi @filip1, is is feasible for you to publish a live example of your website as it is today? So we can have a look and better advise you.


@vvo Here is the dev website:

When you are on homepage you can search for example “excel” courses in Toronto. It should give the Toronto + Virtual courses. That is the requirement.

Thanks for that.

About ranking and ordering, how would you like to rank the virtual courses? Should they always be the top results? Or the last results?

Should you maybe on your first screen have an option to only display virtual courses?

What I mean is that, as a user if I want to see excel courses in Toronto, when do you want to push me virtual courses? At the beginning of results? At the end of them? It might not be as relevant as we think to push virtual courses to someone that specifically said he wanted in person courses in Toronto. Maybe we need to have a dedicated virtual courses category?

Let me know so I can better guide you afterwards.

We could rank those virtual to the end of the results, but the main idea is that the clients wants those too and the infrastructure is inherited, in their old database a virtual course belongs to a location “virtual” with 0 lat and long.

Do you want it to be at the end of ALL results? Which mean you would get those results only after going through all the pages, that’s maybe more than ten pages so not many people will do that.

Or do you want it to be at the end of every page, a last result that says “See our online courses for excel” that would then bring you to a list of online courses for excel.

That would maybe be more efficient, as mixing both in person and virtual courses in a linear way (first all in person, then virtual) might not be the best way to promote your online courses.

What do you think?

I agree it’s not the most efficient way,

But the client wanted to see all those mixed ordered by date, the most recent ones in the top.

I could propose a different approach, but only if it’s not possible to mix those.

Ok so the order you want to rank them is: "Show any type of course (Virtual/in person around the selected city) and rank them by most up to date.

If that’s it then Ill see with search ranking experts in my team on how to do that.


Yes, that’s the way. To problem I had using instantsearch was that when I applied a geo-filter i could not also include some other filters to include the virtual ones. I tried something with the optionalFilters but don’t know how those filters work because the response from Algolia was that my account does not have the right to use optionalFilters

Exactly what I am currently asking for advice to search ranking experts, will get an answer in ~ one day.

1 Like

Hi @filip1, after discussing with our search experts and the API team, here’s the conclusion.

There’s no way today with Algolia to do a ranking where both non geolocalized and geolocalized results are mixed up based on an update date. There are workarounds but they involve reordering results on the frontend which would lead to bad performance and ranking.

The solutions today are:

  1. display one or two virtual courses at the top of every result page
  2. or/and display one or two virtual courses at the bottom of every result page
  3. or have a separate listing for online courses

To do 3. that’s just another search page with different parameters based on an attribute like “virtual: true”.

To do 1. or 2., you will have to do multiple queries like shown in this example:

What I would advise you is to go this way, try modifying the example online and ask for more help if you don’t see how to do it (no problem)

Sorry that your use case today is not well supported. Algolia was built with the user experience in mind, and mixing virtual and geolocalized result does not always lead to a good user experience. If I select Atlanta as a city I might only want to see Atlanta results and not virtual ones. Thus this solution which is not ideal given what you initially wanted.

Thanks for using Algolia!

@vvo is there a way to sync widget between two instantsearch objects? I have two tabs now: local and virtual courses. But when i change a filter for one of them, i want both to reflect update.

Hi @filip1 could you create one live example that we could work on together? Use this template:

Just add a second instantsearch instance displaying hits from another index or your data and then we’ll see how to sync widgets. Thanks!

@vvo the only problem that i have now is with using different hierarhical filters. See this concrete example:

  1. Go to
  2. Select virtual courses tab
  3. Try to filter by a category beneath the tab (eg. Business and Leadership Skills (1))
  4. The query is not seeing the updated url and does not filter the results.
  5. Hit refresh F5, then select the virtual courses tab again.
  6. The list is filtered.

So the problem is that I mapped the hFR parameter to hfrVirtual for the second instance of instantsearch. The instant search library somehow does not see that the url is changing even though I have set urlSync.trackedParameters to include the new mapped url.

Specifically, is there a function to “force” re-apply the filters?

Hi @filip1 to better help you out I would need you to isolate this behaviour with the least amount of code possible inside our template:

As debugging a whole application can be really tricky to do, I am asking you to help me out here.

Build an example where there’s only the two tabs, the hierachical links, with your data and then since the code will be small we’ll be able to help you out.

I can see that the behaviour is not right but I need you to isolate the issue a little bit more instead of having the full application code.

Thanks a lot!

The situation is too complex to trim it down… never mind, if you cannot help me I will figure something. Maybe copy the whole library and modify the core to suit my needs.