12/08/2018, 15:17

Nhúng google map vào ứng dụng rails với gem Geocoder

Hôm nay mình sẽ chuyển qua Rails và trình bày một cách đơn giản để sử dụng bản đồ trong ứng dụng rails với gem Geocoder. Về google map api mọi người có thể tham khảo bài viết Google map API . Get Google API key Để sử dụng được Google Maps API, chúng ta cần phải đăng ký app project trên Google ...

Hôm nay mình sẽ chuyển qua Rails và trình bày một cách đơn giản để sử dụng bản đồ trong ứng dụng rails với gem Geocoder. Về google map api mọi người có thể tham khảo bài viết Google map API .

Get Google API key

Để sử dụng được Google Maps API, chúng ta cần phải đăng ký app project trên Google API Console và get API key để dùng. Mọi người có thể get key đơn giản bằng cách click vào nút get a key qua link sau: Quick start to get API key hoặc có thể đăng ký và quản lý key cho project qua Googel API Console Sau khi get key xong chúng ta cần thêm đoạn script để dùng API của Google như sau:

<script src="//maps.google.com/maps/api/js?v=3.27&key=AIzaSyDEHpTjzc2CyFPY_m-_QCBWDI25w2pbnYM"></script>

Note: ở đây mình chỉ định luôn là Google map api version 3.27. đoạn script này chúng ta có thể thêm ngay trong phần view cần dùng.

Geocoder

Ok vậy là bước chuẩn bị key đã xong. Trước hết mình sẽ giới thiệu qua gem geocoder và tại sao mình dùng nó mà không phải 1 gem khác như gmaps4rails. Trước hết Geocoder là một giải pháp mã hóa địa lý trong Ruby. Nó có một vài tính năng cụ thể như sau:

  1. Chuyển đổi địa điểm thành tọa độ địa lý và ngược lại
  2. Tìm địa điểm gần vị trí cho trước
  3. Chuyển đổi địa chỉ IP thành vị trí

Trước đó khi chuẩn bị làm task này mình nghĩ đến gem gmaps4rails nhưng rồi đọc tìm hiểu thì thấy cần thêm cả thư viện js ngoài như underscore để custom map hay việc tạo và generate JSON để tạo map khá phức tạp. Trong khi cái mình thực sự cần là latitude (vĩ độ) và longitude (kinh độ). Rồi tìm hiểu thì mình thấy geocoder làm đơn giản và khá mạnh nếu mình khai thác thêm như mấy chức năng cơ bản mình nêu trên. À ngồi vọc còn thấy ngoài author chính là Alexreisner thì còn có chị Phạm Thu Trang là contributor (xếp thứ 2 và có quyền merge pull request             </div>
            
            <div class=

0