Linear のデータをDevExpress Data Grid にデータバインドする。
CData ADO.NET Provider for Linear は、サードパーティ製コントロールと組み合わせて使える標準的なADO.NET データアクセスコンポーネントを備えています。通常のADO.NET データバインドの手順に沿って進めるだけで、UI コントロールからリアルタイムデータの取得・表示を実現できます。この記事では、CData のコンポーネントを使って DevExpress UI コントロール(Windows Forms およびWeb コントロール) にデータバインドする方法を紹介します。今回は、リアルタイムのデータを可視化するチャートにデータバインドしていきます。
Linear への認証には、個人用 API キーまたは OAuth 2.0 を使用できます。ご自身の Linear アカウントで接続する場合は、API キーを使うのが最も手軽です。
API キーによる認証
以下の接続プロパティを設定します。
- AuthScheme:APIKey に設定します。
- APIKey:Linear の個人用 API キー。
個人用 API キーを作成するには、Linear にログインして Settings > Security & access > Personal API keys を開き、New API key を選択して作成します。キーは一度しか表示されないため、すぐにコピーしておきましょう。
OAuth による認証
OAuth を使用するには、Linear にカスタム OAuth アプリケーションを登録する必要があります(Settings > API > OAuth applications)。登録すると OAuthClientId と OAuthClientSecret が発行されます。対応しているフローは以下の 2 つです。
- Authorization code:AuthScheme を OAuth、InitiateOAuth を GETANDREFRESH に設定し、OAuthClientId、OAuthClientSecret、およびアプリケーションで定義した CallbackURL(例:http://localhost:33333)を指定します。ドライバーがブラウザで Linear を開くので、アクセスを許可してください。
- Client credentials:AuthScheme を OAuthClient に設定し、OAuthClientId と OAuthClientSecret を指定します。アプリケーション自体を認証するためブラウザ操作は不要で、マシン間(M2M)連携に適しています。
デフォルトでは、ドライバーは read,write スコープをリクエストします。アクセストークンは有効期限が切れると自動で更新されます。
Windows Forms コントロール
下のコードでは、Linear でDevExpress のチャートに追加する方法を説明します。LinearDataAdapter はチャートコントロールのSeries プロパティにバインドします。コントロールのDiagram プロパティはx 軸とy 軸をカラム名として定義します。
using (LinearConnection connection = new LinearConnection(
"AuthScheme=APIKey;APIKey=myAPIKey;")) {
LinearDataAdapter dataAdapter = new LinearDataAdapter(
"SELECT id, name FROM Team WHERE key = 'ENG'", connection);
DataTable table = new DataTable();
dataAdapter.Fill(table);
DevExpress.XtraCharts.Series series = new DevExpress.XtraCharts.Series();
chartControl1.Series.Add(series);
DataTable table = new DataTable();
series.ValueDataMembers.AddRange(new string[] { "name" });
series.ArgumentScaleType = DevExpress.XtraCharts.ScaleType.Qualitative;
series.ArgumentDataMember = "id";
series.ValueScaleType = DevExpress.XtraCharts.ScaleType.Numerical;
chartControl1.Legend.Visibility = DevExpress.Utils.DefaultBoolean.False;
((DevExpress.XtraCharts.SideBySideBarSeriesView)series.View).ColorEach = true;
}
Web コントロール
下のコードではLinear でDevExpress Web を操作するための設定方法を説明します。LinearDataAdapter はチャートのSeries プロパティにバインドします。Diagram プロパティはx 軸とy 軸をカラム名として定義します。
using DevExpress.XtraCharts;
using (LinearConnection connection = new LinearConnection(
"AuthScheme=APIKey;APIKey=myAPIKey;"))
{
LinearDataAdapter LinearDataAdapter1 = new LinearDataAdapter("SELECT id, name FROM Team WHERE key = 'ENG'", connection);
DataTable table = new DataTable();
LinearDataAdapter1.Fill(table);
DevExpress.XtraCharts.Series series = new Series("Series1", ViewType.Bar);
WebChartControl1.Series.Add(series);
DataTable table = new DataTable();
series.ValueDataMembers.AddRange(new string[] { "name" });
series.ArgumentScaleType = ScaleType.Qualitative;
series.ArgumentDataMember = "id";
series.ValueScaleType = ScaleType.Numerical;
((DevExpress.XtraCharts.SideBySideBarSeriesView)series.View).ColorEach = true;
}