ComponentOne Studio TrueChart for ASP.NET (C1WebChart2D) ヘルプ
手順 1:グラフのデータソースの作成
C1Chart のクイックスタート > 手順 1:グラフのデータソースの作成

この手順では、[グラフのプロパティ]ダイアログボックスを使用して、グラフを後でバインドできるデータソースを作成します。.NET プロジェクトを作成して、以下の手順を実行します。

新しいデータソースの追加

  1. プロジェクトツールバーで、[データ]メニューから[新しいデータソースの追加]を選択します。[データソース構成ウィザード]ダイアログボックスが表示されます。
  2. データベースを選択して〈次へ〉をクリックします。
  3. 新しい接続〉をクリックします。
  4. 接続の追加]ダイアログボックスで、〈参照〉をクリックします。
  5. Microsoft Access データベースファイルの選択]ダイアログボックスで、Nwind.mdb(場所はデフォルトで C:\Program Files\Common Files\C1Studio\Data)を指定して〈開く〉をクリックし、〈OK〉をクリックします。
  6. 次へ〉をクリックして操作を続行します。データファイルをプロジェクトに追加して接続文字列を修正するかどうかを確認するダイアログボックスが表示されます。データベースをプロジェクトにコピーする必要はないため、〈いいえ〉をクリックします。
  7. 名前を指定して接続を保存する]チェックボックスが ON になっていることを確認し、〈次へ〉をクリックして操作を続行します。

    接続文字列は NwindConnectionString として保存されます。

  8. テーブル]ノードを拡張して、Categories オブジェクトと Products オブジェクトを選択します。
  9. 完了〉をクリックします。

OleDbDataAdapter の追加

  1. ツールボックスを右クリックして〈アイテムの選択〉をクリックし、ダイアログボックスの「.NET Framework コンポーネント」タブで、OleDbDataAdapter を選択します。

    ツールボックスでOleDbDataAdapter コンポーネントをダブルクリックすると、OleDbDataAdapter がコンポーネントトレイに表示され、データアダプタ構成ウィザードが表示されます。

  2. データアダプタ構成ウィザードで、データアダプタに使用する接続(この場合は、C:\Program Files\Common Files\C1Studio\Data\Nwind.mdb)をドロップダウンリストボックスから選択して、〈次へ〉をクリックします。
  3. デフォルトでは、[SQL 文を使用する]が選択されています。〈次へ〉をクリックします。
  4. 次の SQL 文をデータアダプタ構成ウィザードのテキストボックスにコピー&ペーストします。
    SELECT CategoryID, ProductName, UnitPrice, UnitsInStock, ReorderLevel FROM Products ORDER BY UnitPrice DESC
  5. 次へ〉をクリックしてから〈はい〉をクリックし、クエリーに主キー列を追加します。
  6. 完了〉をクリックします。

    OleDbConnection1 コンポーネントが自動的にコンポーネントトレイに挿入されることを確認してください。

    データセットの作成

    以下の手順を実行して、OleDbDataAdapter1 に関連したデータセットを作成します。

  7. OleDbDataAdapter1 を選択し、そのスマートタグをクリックして、〈DataSet の作成〉をクリックします。[データセットの作成]ダイアログボックスが表示されます。
  8. 〈既存〉ラジオボタンが選択されていること、[Products]テーブルが選択されていること、およびオプション[このデータセットをデザイナに追加する]が選択されていることを確認して、〈OK〉をクリックします。

    NWindDataSet1 がコンポーネントトレイに追加されます。

2つめの OleDbDataAdapter の追加

  1. ツールボックスから、OleDbDataAdapter コンポーネントをダブルクリックして、OleDbDataAdapter コンポーネントをもう1つコンポーネントトレイに追加します。
  2. ディレクトリを表示するデータ接続 ACCESS. C:\Program Files\Common Files\C1Studio\Data\Nwind.mdb を、ドロップダウンリストボックスから選択します。
  3. 次へ〉をクリックして操作を続行します。
  4. SQL 文を使用する]が選択されていることを確認して、〈次へ〉をクリックします。
  5. 次の SQL 文をデータアダプタ構成ウィザードのテキストボックスにコピー&ペーストします。
    SELECT CategoryName, CategoryID FROM Categories
  6. 次へ〉をクリックして、〈完了〉をクリックします。

OleDbDataAdapter2 用のデータセットの作成


以下の手順を実行して、OleDbDataAdapter2 に関連したデータセットを作成します。

  1. OleDbDataAdapter2 を選択し、そのスマートタグをクリックして、〈DataSetの作成〉をクリックします。
  2. データセットの作成]ダイアログボックスで〈新規作成〉をクリックして、名前を categoriesDataSet とします。
  3. Categories]テーブルが選択されていること、およびオプション[このデータセットをデザイナに追加する]が選択されていることを確認して、〈OK〉をクリックします。

    CategoriesDataSet1 がコンポーネントトレイに追加されます。

データセットへの入力

データセットに入力するには、次のコードを Form1_Load イベントに追加します。

Visual Basic コードの書き方

Visual Basic
コードのコピー
oleDbDataAdapter1.Fill(nwindDataSet1)
oleDbDataAdapter2.Fill(categoriesDataSet1)

C# コードの書き方

C#
コードのコピー
oleDbDataAdapter1.Fill(nwindDataSet1);
oleDbDataAdapter2.Fill(categoriesDataSet1);

DataView コンポーネントの追加

デザインビューに戻って、以下の手順を実行します。

  1. ツールボックスを右クリックして〈アイテムの選択〉をクリックし、ダイアログボックスの「.NET Framework コンポーネント」タブで、DataView を選択します。
  2. DataView のプロパティウィンドウで、各プロパティを次のように設定します。
    • AllowDelete = False
    • AllowEdit = False
    • AllowNew = False
    • Table = nwindDataSet1.Products

これで、データソースの作成は正常に完了しました。次の手順では、グラフを追加して既存のデータソースにバインドする方法、および[グラフのプロパティ]ダイアログボックスを使用してグラフを手軽にカスタマイズする方法を示します。