CodeZine(コードジン)

特集ページ一覧

マウスイベントに対応したグラフを持つWPFアプリケーションの作成

ComponentOne Studio Enterprise 2011JのC1Chartコントロールを使ったWPFアプリケーションの作成

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2011/09/21 14:00
目次

ビジュアルの変更

 続いて、グラフをカスタマイズしていきます。

 まず、XAMLコードの1番目の<c1chart:DataSeries>をクリックします。プロパティウィンドウが「DataSeries」クラスのプロパティに変わるので、[その他]をクリックして展開し[SymbolMarker]プロパティの値欄をクリックします。リストが展開したら、[Star8]を選びます。これにより、最低気温のグラフのシンボルが星形に変わります。

プロパティリストから[Star8]を選ぶ
プロパティリストから[Star8]を選ぶ

 縦軸のデータラベルが1℃おきになっているので、これを2℃単位に変え、XY軸のラベルを設定します。ここでは「ChartView」クラスのAxisクラスを使用します。X軸、Y軸それぞれに、「AxisX」「AxisY」クラスを使用し、表示するデータの範囲はMin・Maxプロパティで指定、増減値は「MajorUnit」プロパティで指定します。また、ラベルを傾ける場合は「AnnoAngle」プロパティを使用します。このグラフでは、縦軸のデータラベルを60度傾けています。軸ラベルを表示する場合は、TextBlockコントロールを使用します。

<c1chart:C1Chart.View>
    <c1chart:ChartView>
        <c1chart:ChartView.AxisY>
            <c1chart:Axis Min="21" Max="37" MajorUnit="2" AutoMin="False" AnnoFormat="00" AnnoAngle="60" >
                <c1chart:Axis.Title>
                    <TextBlock Text="気温(℃)" TextAlignment="Center" Foreground="BlueViolet" Margin="5"/>
                </c1chart:Axis.Title>
            </c1chart:Axis>
        </c1chart:ChartView.AxisY>
        <c1chart:ChartView.AxisX>
            <c1chart:Axis>
                <c1chart:Axis.Title>
                    <TextBlock Text="東京 8月" TextAlignment="Center" Foreground="BlueViolet" Margin="7"/>
                </c1chart:Axis.Title>
            </c1chart:Axis>
        </c1chart:ChartView.AxisX>
    </c1chart:ChartView>
</c1chart:C1Chart.View>
XY軸に軸ラベルを表示し、縦軸の温度を2℃ごとに表示
XY軸に軸ラベルを表示し、縦軸の温度を2℃ごとに表示

テーマの適用

 このままではビジュアル的にちょっと味気ないので、テーマを適用してより視覚効果を高めていきます。

 C1Chartコントロールには、あらかじめ12個の組み込みテーマが使用できるようになっています。テーマを定義するには、次のようなXAMLコードを<c1chart:C1Chart>タグに追加します。

<c1chart:C1Chart Theme="{DynamicResource {ComponentResourceKey TypeInTargetAssembly=c1chart:C1Chart, ResourceId=Office2007Black}}">

 最後の「ResourceId」がテーマを決める要素になります。これらのテーマはChart for WPFのインストールディレクトリ(デフォルトでは、<UserFolder>\Misc\Xaml\WPF\C1WPFChart)に、XAMLファイルとして置かれているので、ファイル名を「ResourceId」に指定します。

テンプレート一覧
要素 説明
ChartTypes.xaml すべての利用可能なグラフタイプのテンプレート
default.xaml Defaultテーマのテンプレート
DuskBlue.xaml Dusk Blueテーマのテンプレート
DuskGreen.xaml Dusk Greenテーマのテンプレート
generic.xaml グラフの各種スタイルと初期スタイルのテンプレート
Grayscale.xaml Grayscaleテーマのテンプレート
Legend.xaml Legendのテンプレート
MediaPlayer.xaml Media Playerテーマのテンプレート
Office2003Blue.xaml Office 2003 Blueテーマのテンプレート
Office2003Classic.xaml Office 2003 Classicテーマのテンプレート
Office2003Olive.xaml Office 2007 Oliveテーマのテンプレート
Office2003Royale.xaml Office 2003 Royalテーマのテンプレート
Office2003Silver.xaml Office 2003 Silverテーマのテンプレート
Office2007Black.xaml Office 2007 Blackテーマのテンプレート
Office2007Blue.xaml Office 2007 Blueテーマのテンプレート
Office2007Silver.xaml Office 2007 Silverテーマのテンプレート
Vista.xaml Vistaテーマのテンプレート

 ここでは、Office 2003 Silverテーマのテンプレートを適用します。

Theme="{DynamicResource {ComponentResourceKey TypeInTargetAssembly=c1chart:C1Chart, 
      ResourceId=Office2003Silver}}" 
<c1chart:C1Chart Height="513" HorizontalAlignment="Left" Margin="34,12,0,0" Name="c1Chart1" 
                 VerticalAlignment="Top" Width="791" ChartType="LineSymbolsSmoothed"
                 Theme="{DynamicResource {ComponentResourceKey TypeInTargetAssembly=c1chart:C1Chart, 
                 ResourceId=Office2003Silver}}" >

 また、カラーパレットを変更することで、さらにテーマの配色を変えることができます。C1Chartコントロールをクリックし、プロパティウィンドウの[可視性-Pallete]の値欄をクリックすると、使用できるカラーパレット名が表示されます。試しに[Metro]を選んでみると、チャートの配色が変わります。

Office 2003 Silverテーマの配色に変更する
Office 2003 Silverテーマの配色に変更する
パレットを「Metro」に変えると配色が変わる
パレットを「Metro」に変えると配色が変わる

 C1Chartコントロールの背景色を変えると、さらにグラフのイメージが変わります。最終的には、C1Chartコントロールは次のようなコードになります。

<c1chart:C1Chart Height="513" HorizontalAlignment="Left" Margin="34,12,0,0" Name="c1Chart1" 
                 VerticalAlignment="Top" Width="791" ChartType="LineSymbolsSmoothed"
                 Theme="{DynamicResource {ComponentResourceKey TypeInTargetAssembly=c1chart:C1Chart, 
                 ResourceId=Office2003Silver}}" Palette="Metro" Background="LemonChiffon">

  • LINEで送る
  • このエントリーをはてなブックマークに追加

バックナンバー

連載:ComponentZine(ComponentOne)

もっと読む

著者プロフィール

  • 瀬戸 遥(セト ハルカ)

    8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

あなたにオススメ

All contents copyright © 2005-2022 Shoeisha Co., Ltd. All rights reserved. ver.1.5