拡張チャート-シーン切り替えマップ

  • 作成者:ayuan0625
  • 編集回数:34次
  • 最終更新:ayuan0625 于 2021-09-06
  • 一.概要

    1. シーン切替マップは、1つのグラフに複数の3次元マップシーンを統合しています。各マップシーンは同時にポイント、線、柱、面を表示することができ、強力な情報表示能力を持っています。

    2. シーン切り替え地図の設定方法は、拡張チャート-地球拡張チャート-地図類に類似しています。本マニュアルでは、基本的なシーン切り替えマップを作成する方法を紹介します。

    3. まず、データを設置するだけで、デフォルトのグラフスタイルでクールなシーンを作ります。次に、需要に応じてシーンの視覚効果をカスタマイズする方法を紹介します。

    二.基礎的なシーン切り替えマップを作る

    1.プラグインバージョンとJSONファイルの更新

    1.拡張チャートプラグインをバージョン4.0以上にアップグレードします。(販売代表または技術サポートに連絡してアップグレードすることができます)

    2.FineReportインストールフォルダの  webapps/webroot/WEB-INF/assets/map/geographic フォルダを開きます。world-3.jsonなどのファイルが入っていない場合は、下の添付ファイルをダウンロードして、このフォルダに入れてください。

    3.デザイナーを再起動し、シーンを使用してマップを切り替えることができます

    world-3d.json

    01.png

     

    2.シーン切り替えマップの挿入

    1.フローティングチャートを挿入します。グラフタイプは、[拡張グラフ-シーン切り替えマップ]を選びます。

    02.png

    2.グラフのサイズを調整します。

    03.png

    3.シーン切り替えマップの設定方法

    シーン切り替えマップのプロパティは、独立したウィンドウで設定することになっています。設定ウィンドウでは、リアルタイムで設定の効果をプレビューすることができます。

    04.png

    4.地図境界の設定

    1.デフォルトの地図境界は[world-3d]ですが、より狭い範囲の領域を境界にすることもできます。

    05.png

    2.既定では、[自動簡易化地図]は有効になっています。複雑なマップ境界が簡略化されますが、小さい島などが表示されなくなります。地図の展示範囲が広い時に利用するのに適しています。

    06.png

    3.[自動簡易化地図]をオフにすると、マップ境界が複雑になり、実際の状況により近いです。地図の表示範囲が小さい場合、特に島が多い場合に適しています

    07.png

    5.データセットの準備

    1.添付のテンプレート内の組み込みデータセット[ds1]および[ds2]を直接的に使用できます。

    2.[ds1]は、ある会社の各地域での粗利益を示しています。

    08.png

    3.[ds2]は、各地への輸出量を示しています。

    09.png

    6.最初のシーンのデータを設定

    1.[データ]-[ポイント]を選択し、下記の画像に従ってデータを設定します。完成すると、左側のプレビューを確認します。データはデフォルトのポイントスタイルで表示されます。

    10.png

    2.[線]を選択し、下記の画像に従ってデータを構成します。完成すると、左側のプレビューを確認します。データポイントの上に、デフォルトの線スタイルで曲線が追加されました。線の太さが統一されています。

    11.png

    7.第2のシーンのデータ設定

    1.[+]ボタンをクリックして新しいシーンを作成します。地図境界の設定をデフォルトにします。

    2.[データ]-[縦棒]を選択し、下記の画像に従ってデータを設定します。

    12.png

    3.[領域]を選択し、下記の画像に従ってデータを設定します。左側のプレビューでは、データが表示される領域が強調表示されます。

    13.png

    8.シーン切り替えの設定

    をクリックして[カルーセル]を選びます。時間間隔を10秒に設定します。

    14.png

    9.効果をプレビューする

    1.シーンは10秒ごとに自動的に切り替えられます。

    15.gif

    2.下のボタンを使って、シーンの切り替えを制御するか、自動切替を一時停止させることができます。左または右ボタンをクリックすると、前または次のシーンに即時に切り替えることができます。

    16.png

    10.テンプレートのダウンロード

    Scene Switch_1.cpt

     

    三.デフォルト設定の変更

    1.初期パースペクティブを修正する

    1.最初のシーンを選択し、マウスを使ってプレビューウィンドウでドラッグして、パースペクティブを調整します。調整が終わると、[初期パースペクティブとして保存]をクリックします。

    17.png

    2.再び視点を調整します。[初期パースペクティブに戻る]をクリックすると、地図パースペクティブは、保存された形に戻ります。

    18.gif

    3.プレビューでは、最初のシーンは保存された設定に従います。

    19.png

    2.シーンの色を変更する

    最初のシーンを選択します。[スタイル]をクリックし、[カラースタイル]のドロップダウンボックスで[青色]を選びます。

    20.png

    3.ポイントスタイルの変更

    1.ポイントを設定します。ポイントは、[ピラミッドポイント]、[コーンポイント]、[角椎ピラミッドポイント]、または[光点]から選び、点の色をカスタマイズすることもできます。

    21.png

    22.png

    23.png

    24.png

    25.png

    2.[サイクル]を無効にすると、光点が表示されなくなります。

    26.png

    4.ポイントラベルの変更

    1.ラベルの一般的な設定方法は通常のチャートとほぼ同じで、ラベルのフォントサイズを調整できます。

    27.png

    2.ラベルの表示方法を[フローティング表示]に設定することができます。すると、ヒントメッセージと同じように、マウスをポイントに止めたときのみにラベルが表示されます。

    28.png

    29.gif

    5.線のスタイルを変更する

    1.[線]を選択して、線の色をカスタマイズします。

    30.png

    2.線の不透明度も調整することができます。

    31.png

    3.既定では、線の起点と終点に光るサイクルが表示されていますが、それぞれ非表示に設定することができます

    32.png

    6.背景の設定

    [背景]を選択すると、背景の特殊効果[粒子]、[流星]、[ギア]、[スイープ]、[最下層レイヤー]を無効にすることができます。空の背景はデフォルトの暗いの背景で、[None]に設定できます。

    33.png

    7.柱のスタイルを変更する

    1.[柱]を選択して、柱のグラデーションをカスタマイズします。

    34.png

    2.柱の幅と高さも調整可能です。

    35.png

    3.[サイクル]を無効にすると、柱の底の光るサイクルが消えます。

    36.png

    8.柱のラベルを変更

    ポイントラベルの設定と同様に、テキストを大きくすることができます。

    37.png

    9.エリアスタイルの変更

    [エリア]を選択して、エリアの色をカスタマイズできます。

    38.png

    10.エリアラベルの変更

    フォントサイズを拡大し、テキストの色を変更します。すると、ラベルが背景と区別されやすくなります。

    39.png

    11.効果をプレビューする

    40.gif

    12.テンプレートダウンロード

    Scene Switch_2.cpt

    四.ドリルダウンシーン切り替え地図との接続

    シーン切り替えマップを作成し、一つのダッシュボード内でドリルダウンレベルを設定して他のコンポーネントのデータを制御する方法について紹介します。

    効果:左側の地図は各地域の売上データを示し、右側のチャートは売上上位5省を示しています。

    884E5F50-9E3D-4156-B075-46FDF39726FF(1).GIF

    地図で江蘇省をクリックすると、地図はその省のドリルダウン地図に切り替わり、その下位都市の売上データが表示されます。右のチャートは表示された江蘇省の売上上位5都市のデータと変わります。

    41DD351F-0F35-4848-A56A-E354148C0F09(1).GIF

    地図のドリルダウン範囲がChina(province)に戻ると、地図が中国各地域の売上データに切り替わり、それに応じて右のチャートも変わります。

    D44580E3-B4EF-44FE-BB46-5ABF95441F63(1).GIF

    1.コンポーネントを挿入する

    新しいダッシュボードを作成し、[拡張グラフ-シーン切り替えマップ]と[目次ギア]を挿入します。

    41.png

    2.データの用意

    3つのデータセットを作成します。そのうちの2つはシーンでドリルダウンマップを作成するためのもので、もう1つは目次ギア用のものです。

    1.データベースのテーブルは、省レベルのデータと市レベルのデータを統合したものです。

    Snag_51b377.png

    2.省データのSQLクエリー

    SELECT * FROM drill_down_jiangsu

    WHERE [level] = "China(Province)"

    データセットを確認します。

    Snag_54d4bc.png

    3.江蘇省データセットのSQLクエリー

    SELECT * FROM drill_down_jiangsu

    WHERE [level] = "Jiangsu"

    データセットを確認します。

    Snag_554151.png

    チャートに必要なデータのクエリ―

    SELECT * FROM drill_down_jiangsu

    WHERE [level] = '${region}'

    ORDER BY sales DESC

    LIMIT 5

    [地域]パラメータのデフォルト値をChina(province)に設定します。

    ORDER BY sales DESC LIMIT 5で、売上トップ5の地域が抽出されます。

    データセットを確認します。

    Snag_5641aa.png

    3.ドリルダウンマップの境界を設定

    地図の境界をChina(Province)とします。左側のウィンドウで、境界線をドラッグし、マウスをスクロールして境界線が完全に表示されるようにし、[初期パースペクティブとして保存]をクリックします。

    46.png

    4.ドリルダウンマップのデータを設定

    1.[データ]のコラムで、[エリア]-[ドリルマップ]を選択し、「各レベル個別指定」を選択します。

    Snag_5b52f7.png

    2.第1レイヤのデータを設定する

    48.png

    3.第2レイヤのデータを設定する

    Snag_5d07db.png

    5.カルーセル目次ギアの設定データ

    Snag_6acee5.png

    6.2つのコンポーネントをリンクする

    1.マップ領域のハイパーリンクを追加すると、ハイパーリンクタイプはCurrent Form Objectになります。このハイパーリンクを設定すると、マップ内の表示領域を使って他のチャートのデータを制御することができます。

    Snag_837d41.png

    2.ハイパーリンクを設定します。[フォームオブジェクト]を、[チャート1]に設定します(このIDは状況によって異なります)。[+]をクリックして、パラメータパスルールを追加します。パラメータは[region]に設定し、[値]は「Area Name」で、をクリックして選択することができます。

    Snag_839d1d.png

    3.マップエリアのハイパーリンクのみを設定した場合、ドリルダウンディレクトリでChina(Province)をクリックしても、カルーセル目次ギアのデータは全省に戻りません。そのため、同じようにドリルダウンディレクトリのハイパーリンクを追加する必要があります。

    Snag_91b8bf.png

    注1: 2つのコンポーネントがcptテンプレートのセル/フローティング要素の場合、ハイパーリンクの種類を[Hyperlink: Linkage Cell]または[Hyperlink: Linkage Floating Elements]に変更する必要があります。

    Snag_43597c5.png

    注2:ダイナミックパラメータを使用してコンポーネントの連携を実現することもできますが、このタイプのハイパーリンクでは、ドリルダウンレベルを変更するたびにレポート全体が更新されます。つまり、ドリルダウンレベルを変更するたびにシーンや他のチャートが再起動し、視覚効果が損なわれることになります。

    7.効果をプレビューする

    この節の最初で紹介した効果が得られます。

    8.原理

    1.地図に全省のデータが表示されている場合、ドリルダウンディレクトリに示されている地域名はChina(Province)です。この値はパラメータ領域に渡されるので、データセットの他のチャートで売上上位5位の省をフィルタリングするのに役立ちます。

    Snag_9a4885.png

    2.地図が江蘇省まで掘り下げられると、地名も[Jiangsu]に変わります。同様に、パラメータ地域に値を渡すことで、売上上位5位の都市はデータセットの他のチャートの結果となります。

    Snag_9a6880.png

    3.China(Province)とJiangsuの2つの地域名は、ポータルの地理情報を確認することで事前に知ることができます。

    9.完成されたテンプレート

    Drill-down Scene.frm


    Attachment List


    Theme: FineReport チャート
    既に最初
    既に最後
    • Helpful
    • Not helpful
    • Only read