typeahead - How to use google places api with bootstrap bloodhound

Question

I want to use multiple datasets feature of bloodhound to get results one from local database and other from google places api. I'm able to fetch results from my local database as following,

// instantiate the bloodhound suggestion engine
    var searchData = new Bloodhound({
        datumTokenizer: function (d) {
            return Bloodhound.tokenizers.whitespace(d.value);
        },
        queryTokenizer: Bloodhound.tokenizers.whitespace,        
        remote: {
            url: 'http:://localhost/address/fetch?q=%Query' //Local URL           
        }
    });
    // initialize the bloodhound suggestion engine
    searchData.initialize();
    // instantiate the typeahead UI
    $('.typeahead').typeahead({        
        hint:false,
        highlight: true,
        minLength: 3
        }, {
        name:'search-data',
        displayKey: 'title',
        source: searchData.ttAdapter(),       
        templates: {            
            suggestion: Handlebars.compile('<p><strong>{{title}}</strong></p>')            
        }        
    });

I want to combine local database results with google places api results using bloodhound multiple datasets feature.

How to get google places api results using bootstrap bloodhound ?

Answer 1

You can try Typeahead Address Picker.

Answer 2

Ideally it is not a good idea to combine Google Places Result and Local Databases Result. It will be very slow. If you are want to show some additional addresses, you can add those places using your application key in Google Places. Those places will go for moderation, but good thing is that even if they got rejected they will be available for your application to use. Only catch is instead of using 'AutoComplete' api you will have to use 'NearyBy' google api and you will need to pass radius and LatLong.

Answer 3

Though late, but you can have a look at typeahead-googleplaces