带标签输入的地理位置

Question

我想添加谷歌地理定位地址的标签输入。

我正在使用这个地理位置 Autofill Address + Google Maps API

这是bootstrap标签输入。 http://timschlechter.github.io/bootstrap-tagsinput/examples/

如果我输入地址并选择自动完成地址，它应该转换为像bootstrap标签这样的标签。

Answer 1

我的解决方案使用Twitter Typeahead和bootstrap标签 - 输入：

        var locations = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('formatted_address'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            identify: function (obj) {
                return obj.place_id;
            },
            remote: {
                url: 'https://maps.googleapis.com/maps/api/geocode/json?address=%QUERY&language={YOUR_LANGUAGE}&key={YOUR_MAPS_API_KEY}',
                wildcard: '%QUERY',
                rateLimitWait: 100,
                transform: function (response) {
                    if (response.status === 'OK') {
                        return response.results;
                    } else {
                        return [];
                    }
                }
            }
        });
        $('input').tagsinput({
            itemValue: 'place_id',
            itemText: 'formatted_address',
            typeaheadjs: [{
                highlight: true
            }, {
                displayKey: 'formatted_address',
                source: locations
            }],
            trimValue: true
        });