Linear のデータをDevExpress Data Grid にデータバインドする。

加藤龍彦
加藤龍彦
デジタルマーケティング
CData ADO.NET Provider for Linear をDevExpress のWindows Forms およびWeb コントロールと組み合わせて使い、チャートに Linear のデータ を取り込みます。



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;
}
The complete code example and the resulting chart.

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;
}
An ASP.NET application created with the ADO.NET Provider and the DevExpress Web Forms control.(Salesforce is shown.)

はじめる準備はできましたか?

Linear Data Provider の無料トライアルをダウンロードしてお試しください:

 ダウンロード

詳細:

Linear Icon Linear ADO.NET Provider

Linear 連携のパワフルな.NET アプリケーションを素早く作成して配布。