You dont have javascript enabled! Please enable it!
widget

Map Viewer widget

Map Viewer widget は、Google Maps API v3 を使用した基本的でシンプルなマップビューアーを提供するウィジェットです。使用には Google API Key が必要です。

このウィジェットは、地図を表示するためにスタンドアロンで使用できます。 ウィジェットに NGSI Entity2poi operatorNGSI Datamodel2poi operator などの他の Wirecloud コンポーネントを介して Point of Interest データを供給し、マップ上に表示できます。

  • CKANソース, NGSI ソース, vCard などの他リソースを使用から来た、カスタム PoI のサポート
  • これらの PoI のソースは、マーカー・アイコン、マーカーの説明 (バブルに表示) などをカスタマイズできます
  • 他のウィジェット/オペレーターへ、ルートのステップ/説明の提供を含るルート情報を提供
  • 選択した PoI により、他のウィジェット/オペレーターの操作が可能

ワイヤリング

入力エンドポイント

  • Address: 地図に表示される住所
  • Coordinates: Google Map マーカーは、この10進座標で表示されます
  • Route:地図上に表示される Google Maps ルート
  • Route Step: ルートの詳細なステップ。Route Description ウィジェットと接続することができます
  • Insert/Update PoI: Point of Interest を挿入または更新します。このエンドポイントは、1つのPoI または 配列を介した複数の PoIs の送信をサポートします。各 PoI は次のフィールドで構成されています:
    • id (required): この PoI を識別するために使用される id。関連付けられた PoI を見つけるための更新および削除操作で使用されます
    • currentLocation (非推奨, location を使用しない場合は必須):
      • longitude (必須):
      • latitude (必須):
      • system: 測地基準系 (geodetic datum system)。通常は WGS84, UTM の可能性があります
    • data: PoI selected 出力エンドポイントによって使用される、対象ポイントに関連付けられたデータ
    • icon: マーカーまたは使用するアイコンを説明するオブジェクトに使用するアイコンのURL。 利用可能なオプション:
      • anchor: アンカー位置。デフォルト値は [0.5, 0.5] (アイコンの中心)
      • anchorXUnits: アンカー x 値が指定されている単位。’fraction’ という値は、x 値がアイコンの一部であることを示します。’pixels’ の値は、ピクセル単位の x 値を示します。デフォルトは ‘fraction’ です
      • anchorYUnits: アンカー y 値が指定されている単位。’fraction’ という値は、y 値がアイコンの一部であることを示します。’pixels’ の値は、ピクセル単位の y 値を示します。デフォルトは ‘fraction’ です
      • opacity: アイコンの不透明度 (範囲は 0~1)。デフォルトは 1 です
      • scale: スケール。デフォルトは 1 です
      • src: イメージのソース URL
    • iconHighlighted: PoI が選択されたときに使用するアイコン設定。icon フィールドと同じように機能します
    • infoWindow: PoI に関連付けられたコンテンツ (HTMLを使用)
    • location (currentLocation を使用しない場合に必要) : GeoJSON ジオメトリ。例えば {“type”: “Point”, “coordinates”: [125.6, 10.1]}
    • minzoom (整数値): この PoI を表示する最小ズーム・レベル。空のままにすると、任意のズーム・レベルで PoI を表示します
    • selectable (ブール値): ユーザがこの PoI を選択できる場合は true。(デフォルトの動作)
    • style: レンダリングに使用するスタイル。サポートされているオプション:
      • fill:
        • color: 塗りつぶし色。CSS3 色、つまり16進数の rgb または rgba の色
      • stroke:
        • color: ストローク色。CSS3 色、つまり16進数の rgb または rgba の色
        • width: ピクセル単位のストローク幅
    • iconHighlighted: PoI が選択されたときにレンダリングするために使用するスタイル。style フィールドと同じように機能します。 提供されない場合、style の設定が使用されます
    • subtitle: PoIに関連付けられたサブタイトル (字幕)
    • title: PoI に関連付けられたタイトル
    • tooltip: マウスが PoI の上にあるときにツールチップとして表示されるテキスト
  • Delete PoI: 地図から1つ以上の PoI を削除します
  • Insert/Update Centered PoI: PoI を挿入または更新し、地図の中心にあるビューポートを変更します。Insert/Update PoI エンドポイントで使用されるのと同じ形式を使用します
  • Select Pol: Pol を選択して、変更します

Output Endpoints

  • Route Description: ステップごとにルートを説明。 Route Description ウィジェットに接続できます
  • PoI selected: 地図上で選択された PoI
  • PoI visibility change: ビュー・ポート内の PoI リストを変更

設定

  • Initial Location: 地図の初期位置を指定。地図の中心となる位置を、地名または10進座標で指定。例: ‘New York’ または ’52, 5’。デフォルトは ”” で空白。マップを中央に配置しない場合は、この設定を空のままにします。 初期位置を指定する場合は、必ず最初のズーム・レベルを変更してください。
  • Zoom Level: マップが中央にあるときのズームレベル。1 から 22 まで。1 は最も遠いレベルを表し、22 は最大ズームレベルを表します。デフォルトは、13 です。
  • Initial Zoom Level: 初期ズームレベル。1 から 22 まで。1 は最も遠いレベルを表し、22 は最大ズームレベルを表します。デフォルトは、3 です。
  • Google API Key: Google API Key を指定します

ワイヤリング例

表示例

※ Google API Key を設定していないため、”For developmnt purpouses only” の表示になっています。

関連情報

WireCloud widget and operatorWireCloud では、ウィジェットとオペレータと呼ばれる機能部品を組み合わせることで、Web アプリケーションやダッシュボードを作成...
error: Alert: Content is protected !!