使用谷歌地图地理定位 api 进行准确的地理定位答案

【问题标题】：Accuracy geolocation with google maps geolocation api使用谷歌地图地理定位 api 进行准确的地理定位
【发布时间】：2020-09-16 08:59:03
【问题描述】：

我正在使用谷歌地图地理定位 API 来检索用户位置，我需要在我的网络应用程序、PC 甚至移动设备上获得更准确的位置。 the docs 请求 cellTowers 和 wifiAccessPoints 信息具有此准确性，这是我的问题。我还没有找到访问这些信息的方法。有人可以帮我吗？我正在使用 React 16.12.0

【问题讨论】：

为什么不改用 W3C 地理定位 API？

标签： reactjs google-maps geolocation

【解决方案1】：

您还可以使用 browser's HTML5 Geolocation feature 和 Maps JavaScript API 在 Google 地图中显示用户位置或设备位置。您可以查看this。

这里还有一个sample reactjs code 实现了这一点。确保在代码中更改 Map.js 文件中的 API 密钥以使其正常工作。这是一个代码sn-p：

import React, { Component } from "react";
import Map from "./Map";
import InfoWindow from "./infowindow";
import "./style.css";

class App extends Component {
  constructor() {
    super();
    this.state = {
      name: "React",
    };
    this.handleLocationError = this.handleLocationError.bind(this);
  }

  handleLocationError(browserHasGeolocation, infoWindow, pos, map) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(
      browserHasGeolocation
        ? "Error: The Geolocation service failed."
        : "Error: Your browser doesn't support geolocation."
    );
    infoWindow.open(map);
  }

  render() {
    return (
      <Map
        id="myMap"
        options={{
          center: { lat: 41.0082, lng: 28.9784 },
          zoom: 8,
        }}
        onMapLoad={(map) => {
          let infoWindow = new google.maps.InfoWindow(); // Try HTML5 geolocation.

          navigator.geolocation.getCurrentPosition(
            function (position) {
              let pos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude,
              };
              infoWindow.setPosition(pos);
              infoWindow.setContent("Location found.");
              infoWindow.open(map);
              map.setCenter(pos);
            },
            function (error) {
              infoWindow.setPosition(map.getCenter());
              infoWindow.setContent(
                true
                  ? "Error: The Geolocation service failed."
                  : "Error: Your browser doesn't support geolocation."
              );
              infoWindow.open(map);
            }
          );
        }}
      />
    );
  }
}

export default App;

【讨论】：