ASP.NET 4の新コントロール
ASP.NET 4で正式に搭載された新コントロールについて簡単に紹介します。
Chartコントロール
ダウンロードすることでVS2008から利用できたChartコントロールですが、VS2010で正式搭載されました。Chartコントロールは多くのグラフが利用できるようになります。
- 円グラフ(ドーナツ-グラフ)
- 折れ線グラフ
- 株価チャート
- 範囲グラフ
- 点グラフ
- バブルチャート
- データ分布図
すべてのChartコントロールは<asp:chart>タグで生成されます。個別のグラフへの指定はChartTypeプロパティを指定し、必要なデータとの関連付けを行うだけです。実行時に表示されるグラフは画像ファイルで生成される他、3D表示も設定一つで実現可能です。
従来はサードベンダー製のコンポーネントを購入するか、自作しないと利用できなかったChartコントロールですがグッと身近になったと言えます(図7)。
Chartコントロールの基本的な利用方法はシンプルです。大まかな流れは次のとおりです。
- ツールボックスからChartコントロールを配置
- データソースコントロールとの関連付けを行う
- 値設定をSeriesコレクションプロパティで、3D設定などをChartAreasコレクションプロパティで、タイトル設定などをTitlesコレクションプロパティから行う
マークアップで簡単に記述できるのが特徴です。以下が記述例となります。
<asp:Chart ID="Chart1" runat="server" DataSourceID="EntityDataSource1" Width="850px"> <%--ChartのX軸/Y軸などを設定--%> <series> <asp:Series Name="Series1" XValueMember="title_id" YValueMembers="qty" MarkerSize="1"> </asp:Series> </series> <%--3Dなどを設定--%> <chartareas> <asp:ChartArea Name="ChartArea1"> <Area3DStyle Enable3D="True" /> </asp:ChartArea> </chartareas> <%--Chartにタイトルなどを設定--%> <Titles> <asp:Title Name="qty/title_id" Text="qty/title_id"> </asp:Title> </Titles> </asp:Chart> <asp:EntityDataSource ID="EntityDataSource1" runat="server" ConnectionString="name=PUBSEntities" DefaultContainerName="PUBSEntities" EnableFlattening="False" EntitySetName="sales"> </asp:EntityDataSource>
上記例では、X軸にTitle_IDを、Y軸でQTY(quantity:売上数)を表示するように設定しています。ChartAreaコレクションプロパティでは、Enable3DプロパティをTrueに設定し、グラフを3D表示しています。以上が基本的なChartコントロール使用例です。
Chartコントロールの活用方法は、.NET TIPS(@IT)の「Chartコントロール」の項目で詳細に説明されているので興味がある方は参照してください。