如何使用React Native获取默认地图

Question

我的应用程序中有一个按钮，应该可以打开默认的地图应用程序。按钮的标题也取决于默认的地图应用程序。例如，如果默认的地图应用程序是Waze，那么按钮的标题应该是Open Waze，依此类推

关于如何在React Native中做到这一点，有什么想法吗？我知道在iOS上你不能更改默认的地图应用程序，但在Android上可以设置默认值。

谢谢！

Answer 1

对于任何未来看到@bisho99评论的人来说，我找到的唯一方法是在expo配置或plist中列出你想要支持的方案，然后使用类似Linking.canOpenURL(appPath)的东西-这是一个异步函数，你可以尝试10个应用程序，然后显示其中任何一个返回true，或者就你认为你的用户应该使用什么应用程序提出一个有主见的选项。

文件：https://reactnative.dev/docs/linking#canopenurl

伪代码示例：

const MAP_SCHEMES = [
'waze',
'citymapper',
'maps',
'applemaps'
];
async function returnPreferredMap(putPathHere) {
const allowedMaps = await Promise.allSettled(MAP_SCHEMES.reduce((promises, scheme) => {
return [...promises, Linking.canOpenURL(`${scheme}://${putPathHere}`)]
}, []);
return allowedMaps.reduce((map, result, index) => {
map[MAP_SCHEMES[index]] = result;
return map;
}, {})
}

Answer 2

您可以使用以下库：https://github.com/flexible-agency/react-native-map-link

或者您可以使用自定义代码，例如：

const scheme = Platform.select({ ios: 'maps:0,0?q=', android: 'geo:0,0?q=' });
const latLng = `${lat},${lng}`;
const label = 'Custom Label';
const url = Platform.select({
ios: `${scheme}${label}@${latLng}`,
android: `${scheme}${latLng}(${label})`
});

Linking.openURL(url);