手順２：サーバー側コントロールの作成

この手順では、アプリケーションにサーバー側コントロールを追加します。

<body> </body>タグの間にカーソルを置きます。Visual Studio ツールボックスの C1BarChart コントロールを見つけてダブルクリックし、このコントロールをページに追加します。追加したマークアップは次のようになります。

ソースビュー	コードのコピー
`<cc1:C1BarChart ID="C1BarChart1" runat="server"></cc1:C1BarChart>`

カーソルを C1BarChart マークアップのすぐ下に置きます。Visual Studio ツールボックスの C1ComboBox コントロールを見つけてダブルクリックし、このコントロールをページに追加します。追加したマークアップは次のようになります。

ソースビュー	コードのコピー
`<cc1:C1ComboBox ID="C1ComboBox1" runat="server"></cc1:C1ComboBox>`

次に、いくつかの C1BarChart プロパティを設定します。<cc1:BarChart> </cc1:BarChart> タグの間にカーソルを置き、次のマークアップを挿入します。これは、ヘッダーテキストを書式設定します。

ソースビュー	コードのコピー
`<Header Text="Hardware Distribution"></Header>`

カーソルを <cc1:C1ComboBox> タグ内の runat="server" オプションのすぐ後に置きます。次のようにマークアップを編集します。

ソースビュー

ソースビュー	コードのコピー
`<cc1:C1ComboBox ID="tagsinput" runat="server" HidingAnimation-Animated-Effect="bounce" ShowingAnimation-Animated-Effect="bounce" HidingAnimation-Duration="600" ShowingAnimation-Duration="600"></cc1:C1ComboBox>`

コードのコピー

<cc1:C1ComboBox ID="tagsinput" runat="server" HidingAnimation-Animated-Effect="bounce" 
    ShowingAnimation-Animated-Effect="bounce" HidingAnimation-Duration="600" 
    ShowingAnimation-Duration="600"></cc1:C1ComboBox>

この手順では、アプリケーションに２つのコントロールを追加し、それらのプロパティのいくつかをマークアップで設定しました。次の手順では、条件付きでデータをロードするためのスクリプトを追加します。