Refactored Baidu Map implementation with search box autocomplete. Map is in a Bootstrap modal and pops up when user navigates away from address text field. Markers can be moved by dragging or clicking another point in the map.
-
The implementation is in Ruby on Rails. Feel free to extract what you need (esp. the Javascript portion).
-
Baidu map does not seem to have HTTPS version. So you will get blocked mixed content error. The solution is:
- Add the following to Gemfile:
gem 'rack-ssl-enforcer'
- Run "bundle install"
- Add the following to config/application.rb:
if Rails.env == "production" || Rails.env == "staging"
config.middleware.use Rack::SslEnforcer, except: [ /edit_venues/ ], strict: true
end
- Replace edit_venues with your own url where you want to display the map
###The flow is:
- User navigates away from address text field
- The modal pops up
- User enters a location to be searched
- User can click/drag marker
- User clicks Done button
- The city field gets updated
- The next field (Phone) is highlighted
- Install Google Translate Chrome extension (so you can click on "Translate this page" for every page)
- Visit http://developer.baidu.com/map/
- Click on API控制台 (or API Console)
- Create an account and get the key
Happy Mapping!