I’m sorry there is no example combining them all. It seems quite complex and let me guide you a little bit.
The example in the first link uses InstantSearch.js and let you move around the map to refine searches. There is a search box (‘place’ widget) which is not useful for you in this case.
The second one uses Autocomplete.js and it shows how to use multiple sources and render them differently.
To combine them all, I think the way to go is to use InstantSearch with
geoSearch widget for the map and to have a custom autocomplete widget. You will need to implement a custom autocomplete widget using
connectAutocomplete connector. You can plug multiple indices, too.
This is a basic example for autocomplete with InstantSearch.
This is a guide for
- Since you want multi-index search, you can read this to learn how to use multi-index with autocomplete + InstantSearch.
I hope this makes sense to you. Let me know how it goes and if there’s anything unclear to you.