在 react-native 中从 openlayers 导入 o​​l

IT技术 reactjs react-native ecmascript-6 openlayers openlayers-3
2021-05-26 04:28:22

您好,我正在使用react-native为我的应用程序创建用户界面。我正在使用 Genymotion 在虚拟 Android 上测试我的代码。我想在我的网络地图应用程序中使用Openlayers javascript 库。我按照以下步骤操作:

  1. npm install openlayers
  2. 我添加import ol from 'openlayers';到“index.android.js”然后当我用 Genymotion 测试我的代码时我得到一个错误。我用过import {ol} from 'openlayers'; instedimport ol from 'openlayers';但它不起作用。

在此处输入图片说明

1个回答

编辑:回答不适合react本机(我的错)

您可能已经找到了这个,或者它可能是您正在使用的包,但是如果您尝试在 react native 项目中使用开放层的标准 Web 版本,那么您可能会遇到问题。我进行了搜索,发现这个包似乎是专为 React Native 设计的开放层

注意这个包只支持开放层3,所以如果你使用开放层4,它会失败。

这是让它工作的步骤

npm install react-openlayers --save-dev

然后

import {
  interaction, layer, custom, control, //name spaces
  Interactions, Overlays, Controls,     //group
  Map, Layers, Overlay, Util    //objects
} from "react-openlayers";

可以在此处找到一个工作示例:

https://github.com/allenhwkim/react-openlayers

希望能帮助到你!