反应原生的Google Map Javascript API

Question

是否有可能使用javascript api而不完全依赖于浏览器DOM来渲染地图，因为反应本机使用View我觉得可以以某种方式使用api，通过传递给全局窗口使api可用的方法也可能使用fetch，但我不知道如何启动回调。如果有人知道这是如何工作的，请分享一些想法

<script async defer
     src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
</script>

Answer 1

所提到的googlemaps节点模块@sunilp只为您提供静态地图，这些地图很容易构建而不依赖于lib，只需搜索google maps api静态地图（没有足够的声誉来发布两个以上的链接）。

对于Android你有这个：https://github.com/teamrota/react-native-gmaps

对于iOS就是这样，但它警告说这是一项正在进行的工作（它还没有在几个月内更新）：https://github.com/peterprokop/ReactNativeGoogleMaps

环顾四周，看来你今天最好的（支持）赌注是使用React Native自己的MapView，如果你搜索他们的文档。然后，您可以对Google Maps API服务进行数据提取调用，然后通过其界面填充MapView。确保您传入密钥并在网址中使用https，否则服务将拒绝您的电话：

fetch(
    'https://maps.googleapis.com/maps/api/directions/json?origin=41.13694,-73.359778&destination=41.13546,-73.35997&mode=driver&sensor=true&key=[YOUR_KEY]'
)
.then(
    (response) => response.text()
)
.then(
    (responseText) => {
        console.log(responseText);
    }
)
.catch(
    (error) => {
        console.warn(error);
    }
);
`

Answer 2

使用渲染的节点方法，尚未尝试，但看起来可以使用node-googlemaps完成

npm install googlemaps

用法

var GoogleMapsAPI = require('googlemaps');

var publicConfig = {
key: '<YOUR-KEY>',
stagger_time:       1000, // for elevationPath
encode_polylines:   false,
secure:             true, // use https
proxy:              'http://127.0.0.1:9999' // optional, set a proxy      for HTTP requests
};
var gmAPI = new GoogleMapsAPI(publicConfig);

你可以参考https://github.com/moshen/node-googlemaps