Google Map API не геокодирует для подробного адреса, и карта также ничего не отображает - PullRequest
Новая
       49

Google Map API не геокодирует для подробного адреса, и карта также ничего не отображает

0 голосов
/ 03 октября 2019

Я установил ключ API и включил его для API геокодирования, а также для API карты Javascript. Тем не менее, Google Geocoder работает только для адресов, которые не содержат подробную информацию, например, улица №. (например, только название города или префектуры).

Консоль Rails - геокодер работает только для общих адресов

Хотя он работает и для адресов только с названиями городов, ничего не отображаетсяна карте. Только пустой синий интерфейс.

Мой конфиг

Geocoder.configure(
  lookup: :google, 
  use_https: true,
  api_key: ENV['GOOGLE_API_SERVER_KEY']
  units: :km
)

Контроллеры событий

class EventsController < ApplicationController
  skip_before_action :authenticate_user!, only: [:index, :show]
    def show
    @event = policy_scope(Event).find(params[:id])
    authorize @event
    @event = Event.find(params[:id])
    @markers =
    {
      lat: @event.latitude,
      lng: @event.longitude
    }
  end
 end

Модель события

class Event < ApplicationRecord
  validates :location, presence: true
  geocoded_by :location
  after_validation :geocode, if: :will_save_change_to_location?
end

Схема

  create_table "events", force: :cascade do |t|
    t.string "name"
    t.text "description"
    t.string "photo"
    t.text "location"
    t.float "latitude"
    t.float "longitude"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.string "date"
    t.bigint "user_id"
    t.index ["user_id"], name: "index_events_on_user_id"
  end

Макет

  <body>
    <%= render 'shared/navbar' %>
    <%= render 'shared/flashes' %>
    <%= yield %>
    <%= javascript_include_tag 'application' %>
    <%= javascript_include_tag "https://maps.googleapis.com/maps/api/js?libraries=places&key=#{ENV['GOOGLE_API_SERVER_KEY']}" %>
    <%= javascript_pack_tag 'application' %>
    <%= javascript_pack_tag "map" %>
  </body>

Отображение карты

        <div
  id="map"
  style="width: 100%;
  height: 500px;"
  data-markers="<%= @markers.to_json %>"
></div>

Javascript

import GMaps from 'gmaps/gmaps.js';

const mapElement = document.getElementById('map');
if (mapElement) {
  const map = new GMaps({ el: '#map', lat: 0, lng: 0 });
  const markers = JSON.parse(mapElement.dataset.markers);
  map.addMarkers(markers);
  if (markers.length === 0) {
    map.setZoom(2);
  } else if (markers.length === 1) {
    map.setCenter(markers[0].lat, markers[0].lng);
    map.setZoom(14);
  } else {
    map.fitLatLngBounds(markers);
  }
}
...