2017-07-30 13 views
1

こんにちは、私はreact-nativeを使用してアプリケーション用のユーザーインターフェイスを作成しています。私は、仮想Android上で自分のコードをテストするためにGenymotionを使用しています。私はOpenlayersのJavaScriptライブラリをWebマップアプリケーションで使用したいと思っています。私は、次の手順に従っ:反応原産のopenlayersからimport olを入力してください

  1. npm install openlayers
  2. 私は「index.android.js」 にimport ol from 'openlayers';を追加しました私はGenymotionで自分のコードをテストするときに、私はエラーを取得します。 私はimport {ol} from 'openlayers'を使用しました。 import ol from 'openlayers';のinstedですが、動作しません。

enter image description here

+0

端末には何が表示されますか? – Avdept

+0

私はWindows 8.1を使用しています。コマンドプロンプトは次のようになります: '_transform.then.catch.error(C:\ Users \ my_user \ some_directory \ PropertyFinder \ node_modules \メトロバンドラー\ビルド\ JSTransformer \ index.js:138:28)' –

+0

は、反応するためのopenlayersライブラリ - ネイティブですか? –

答えて

1

EDIT:ANSWER FOR REACT-ネイティブではない(私の悪い)

あなたはすでにこれを発見したこと、または多分それはあなたが使用しているパッケージですが、あなたがしている場合反応しているネイティブプロジェクトで標準のWebバージョンのオープンレイヤーを使用しようとすると、そのような問題が発生する可能性があります。私は、検索を行なったし、このパッケージには、唯一のオープンレイヤ3をサポートしてネイティブ

NOTEを反応させるので、あなたが開い層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

はそれが役に立てば幸い!

+0

あなたの答えにお世話になり、ありがとうございます。あなたの答えはreact.jsですが、私は反応ネイティブに問題があります。 –

+1

私の悪い答えのための苦難として、私はもう少し研究をした、と私は反応 - ネイティブマッププラグインのこのスレッドを発見した。 https://github.com/airbnb/react-native-maps/issues/1098現在はGoogleマップに依存しているようですが、その依存関係を取り除くために働いている人がいます。代わりのオプションを探してみましたが、そうしなかった満足できるものを考え出してください:/申し訳ありません –

+0

問題はありません。もう一度感謝します。私はOpenlayers3を使ってWeb上にルーティングマップアプリケーションを作成し、このモジュール(Openlayers on reactネイティブ)を使用して、ネイティブ環境でAndroidおよびIOSのルーティングマップアプリケーションを作成します。バックエンドでGeoserver REST APIを使用しています。良い選択肢がありますか? –

関連する問題