[GO] [Rails] So erhalten Sie Standortinformationen mithilfe der Geolocation-API

Entwicklungsumgebung

・ Ruby: 2.5.7 Schienen: 5.2.4 ・ Vagrant: 2.2.7 -VirtualBox: 6.1 ・ Betriebssystem: macOS Catalina

Annahme

Folgendes wurde implementiert.

Schlanke EinführungGoogle Map-Anzeige

Aktivieren Sie die Geolocation-API

Bitte aktivieren Sie die "Geolocation-API", indem Sie das gleiche Verfahren wie unter "Aktivieren der Geocoding-API" im folgenden Artikel ausführen.

Berechnen von Längen- und Breitengraden mithilfe der Geolocation-API

Implementierung

slim:~.html.slim


#map style='height: 500px; width: 500px;'

- google_api = "https://maps.googleapis.com/maps/api/js?key=#{ ENV['GOOGLE_MAP_API'] }&callback=initMap".html_safe
script{ async src=google_api }

javascript:

  let map;

  function initMap() {
    //Standortinformationen abrufen
    navigator.geolocation.getCurrentPosition(function (position) {
    LatLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);

      //Zeigen Sie hauptsächlich die erfassten Positionsinformationen an
      map = new google.maps.Map(document.getElementById('map'), {
        center: LatLng,
        zoom: 15
      });
    });
  }

Hinweis

Wenn Sie "Turbolinks" nicht deaktivieren, wird die Karte nicht umgeschaltet. Deaktivieren Sie sie daher unbedingt.

So deaktivieren Sie Turbolinks

Recommended Posts

[Rails] So erhalten Sie Standortinformationen mithilfe der Geolocation-API
So erhalten Sie Artikeldaten mithilfe der Qiita-API
So erhalten Sie mithilfe der Mastodon-API Follower und Follower von Python
[Python] Ich habe versucht, mithilfe der YouTube-Daten-API verschiedene Informationen abzurufen!
[Rails] google maps api So posten und anzeigen Sie einschließlich Karteninformationen
So erhalten Sie mithilfe der API von Virus Total einen Beispielbericht aus einem Hashwert
[Rails] Erkennen radikaler Bilder durch Analysieren von Bildern mithilfe der Cloud Vision API
So zeigen Sie eine Karte mit der Google Map API (Android) an
Verwendung von Folium (Visualisierung von Standortinformationen)
Lassen Sie uns Wiki-Informationen mithilfe der MediaWiki-API abrufen
Analysieren mit Google Colaboratory mithilfe der Kaggle-API
Informationen erhalten Sie mit zabbix api
Holen Sie sich GitHub-Informationen mit PyGithub
Ich habe versucht, die Standortinformationen des Odakyu-Busses zu erhalten
Zurücksetzen des Passworts über die API mit dem Django Rest Framework
Ich habe versucht, die Informationen des Webs mit "Requests" und "lxml" abzurufen.
So erhalten Sie die Temperatur vom SwitchBot-Thermo-Hygrometer mit Himbeer-Pi
Ich habe versucht, verschiedene Informationen von der Codeforces-API abzurufen
Ausgabe von Produktinformationen an csv mithilfe der Rakuten-Produktsuch-API [Python]
Rufen Sie github api in Python auf, um Informationen zur Pull-Anforderung zu erhalten
So installieren Sie Python mit Anaconda
[Rails] So zeigen Sie Google Map an
Abrufen von Salesforce-Daten mithilfe der REST-API
So erhalten Sie die Python-Version
Wie fange ich mit Scrapy an?
Erste Schritte mit Python
Abrufen von Amazon-Daten mit Keep API # 1 Abrufen von Daten
Wie fange ich mit Django an?
Verwendung der Python-API von OpenPose
Versuchen Sie, Statistiken mit e-Stat abzurufen
Wie benutzt man Bing Search API?
[Python] Verwendung der Typetalk-API
[Yahoo! Weather Replacement Version] So erhalten Sie Wetterinformationen mit LINE Notify + Python
So erhalten Sie den Wert aus dem Parameterspeicher in Lambda (mit Python)
Ich habe versucht, die Filminformationen der TMDb-API mit Python abzurufen
So suchen Sie mit Pythons Astroquery und erhalten passende Bilder mit Skyview
[Rails] Einführung in Google Analytics [Easy]
So erhalten Sie die Eltern-ID mit sqlalchemy
Wie man lange Einschlüsse loswird
So zeichnen Sie ein Diagramm mit Matplotlib
Massenposting an Qiita: Team mit Qiita API
Wie bekomme ich IP bei Tornado + Nginx
So richten Sie SVM mit Optuna ein
Erhalten Sie E-Mails mithilfe der Google Mail-API in Java
So installieren Sie ein Paket mithilfe eines Repositorys
So stellen Sie xg boost mit Optuna ein
Wie bekomme ich Stacktrace in Python?
Holen Sie sich Youtube-Daten in Python mithilfe der Youtube-Daten-API
So erhalten Sie eine farbige Ausgabe an die Konsole
So laden Sie YouTube-Videos mit pytube3 herunter
[Python] Python-Paketinformationen mit der PyPI-API abrufen
Verwendung der Cloud Vision API von GCP
Erhalten Sie Informationen zur virtuellen Währung mit der API coin
[Rails] So berechnen Sie Breiten- und Längengrade mit hoher Genauigkeit mithilfe der Geocoding-API und zeigen sie auf Google Map an
So erhalten Sie den Notebook-Namen, den Sie derzeit in Google Colab verwenden
So codieren Sie eine Drohne mithilfe der Bilderkennung
So implementieren Sie Rails-Helfer-ähnliche Funktionen in Django
Vorgehensweise zur Verwendung der WEG-API von TeamGant (mit Python)
So richten Sie eine zufällige Gesamtstruktur mit Optuna ein
[Python] Holen Sie sich alle Kommentare mit Youtube Data Api