タイルレイヤーの紹介

優れたエグゼクティブダッシュボードは、ビジネスの状況、詳しく確認すべき箇所、数値の鮮度を一目で伝えます。Navicat 18のビジネスインテリジェンス（BI）ツールには、そのストーリーを構築し、最新の状態に保ちやすくする機能がいくつか追加されています。今回は、シンプルな売上概要ダッシュボードを作成し、タイルレイヤーを使用します。今後の数回の記事では、新しいパラメーター、ページナビゲーション、自動更新の各機能を取り上げます。

このチュートリアルでは、MySQLのサンプルデータベース「classicmodels」に接続したデータソースをすでに作成し、以下で取り上げるものと同様の3つのチャートと、ダッシュボード自体も作成済みであることを前提とします。以下の手順は、その状態から始まります。

タイルレイヤーでダッシュボードを配置する

製品ライン別の総売上、月別売上推移、注文金額別の上位顧客一覧という3つのチャートがあり、いずれもorders、orderdetails、customersテーブルから取得しているとします。それぞれを手作業で配置してサイズ変更する代わりに、タイルレイヤーを使用してみましょう。

• まず、ページ全体が表示されるようにズームアウトします。BIワークスペース画面の右下にあるズームコントロール（「100%」と表示されている箇所）をクリックします。さまざまなズームプリセットを含むコンテキストメニューが開くので、ダッシュボード全体を表示するために「合わせる」を選択します。

  

• 「ダッシュボード」タブで「タイルレイヤーを追加」をクリックし、マウスポインターで目的の範囲を選択してページ上に配置します。

  

• これで、3つのチャートをレイヤーに追加する準備ができました。「チャートを追加」ボタンをクリックし、最初のチャートをタイルレイヤーコンテナの境界内に直接配置します。マウスボタンを離してチャートをレイヤーに配置できる状態になると、レイヤーの色が変わります。チャートはレイヤー内のスペース全体に広がります。

  

• 2つ目のチャートをレイヤー上にドラッグすると、チャートが配置される場所を示す色付きの四角形が表示されます。

  

  最初のチャートの右側に配置しましょう。

  

• 3つ目のチャートにも同じ手順を行います。

レイアウトの微調整

3つのチャートをすべて配置したので、ダッシュボードを整える準備ができました。

• まず、レイヤーをダッシュボードの幅いっぱいに広げます。レイヤー右端の四角いハンドルをつかみ、ダッシュボードの右端までドラッグします。

  

• レイヤーのプロパティペインには、チャートをすばやく配置するのに役立つ「レイアウト」と「分布」という2つのドロップダウンメニューがあります。.
  • 「レイアウト」はデフォルトで「水平」に設定されているため、チャートは横に並びます。
  • 「分布」は「均等に配置」に設定されており、3つのチャートが自動的にサイズ変更されて、利用可能なスペースを均等に分け合います。

  

  どちらの設定もこのままで問題ないため、変更しません。

• 最後に、レイヤーをページ下部に配置します。これには次の2つの方法があります。

  • 1つ目は、「オブジェクト」ペインでレイヤーを右クリック（macOSではControlキーを押しながらクリック）し、コンテキストメニューから「配置」>「下」を選択する方法です。

    

  • もう1つは、左上隅のすぐ上にある位置アイコンを使用して、レイヤーを手動でドラッグする方法です。

    

こちらが「表示」モードで表示した完成後のダッシュボードです。タイトルも付いています。

すべてを組み合わせる

Navicat 18の新しいBI機能を組み合わせると、いくつかのチャートが印象的なレポートツールへと変わります。つまり、内容の増加に応じて調整されるレイアウト、作り直すことなく閲覧者がデータを探索できるフィルター、関連するビュー間のナビゲーション、自動的に最新の状態に保たれるデータを備えたツールです。次回の記事では、ワークスペースレベルで一度定義し、複数のチャートに同時にフィルターとして適用できる再利用可能な変数「パラメーター」の使い方を説明します。