从openlayers以本机方式导入ol [英] import ol from openlayers in react-native

问题描述

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

Hellow, I'm using react-native to create a User Interface for my application. I'm using Genymotion for testing my code on virtual Android. I wanna use Openlayers javascript library in my web map application. I followed these steps:

1. npm install openlayers
   
2. 我在中添加了import ol from 'openlayers'; 然后当我用Genymotion测试我的代码时，我得到一个错误. 我用import {ol} from 'openlayers';插入了import ol from 'openlayers';，但没有用.

1. npm install openlayers
   
2. I added import ol from 'openlayers'; to "index.android.js" then when i test my code with Genymotion I get an error. I used import {ol} from 'openlayers'; insted of import ol from 'openlayers'; but it doesn't worked.

推荐答案

不适合本机回答(我不好)

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

You may have already found this, or perhaps it is the package you are using, but if you are attempting to use the standard web version of open layers in the react native project, you might have issues doing that. I did a search and found this package which appears to be open layers specifically designed for react native

注意:此软件包仅支持开放式第3层，因此，如果您使用开放式第4层，则将失败.

NOTE This package only supports open layers 3, so if you are using open layers 4, it will fail.

以下是使其正常运行的步骤

Here's the steps to get it working

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";

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

A working example can be found here:

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

希望有帮助！

这篇关于从openlayers以本机方式导入ol的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！