ナレッジベース

Xuni

FlexChartでは、その系列（ChartSeries）ごとに、チャート種類（ChartType）を指定できます。

例えば3つの系列がある場合には、それぞれの系列に対して異なる種類にできます。
さらに、軸を追加することも可能なので規定では向かって左側にのみ表示されるY軸の他に、
右側にも単位の異なるY軸を表示可能です。
追加したY軸は特定の系列に関連させます。

以下の例では、縦棒グラフ、面グラフ、シンボル付き折れ線グラフを1つのチャートとして表示しています。
シンボル付き折れ線グラフのみ右側のY軸に対応したものです。
折れ線グラフの値は50～80の間で、他のグラフは1～10の間で推移するサンプルデータを設定しています。

サンプルコード
C#（Xamarin.Forms）

public partial class Xuni_QuickStartPage : ContentPage
{
    public Xuni_QuickStartPage()
    {
        Title = "複合チャート";
        InitializeComponent();
        flexchart.ItemsSource = new SampleDataSource().dt;
        flexchart.BindingX = "X";

        // エリアグラフの作成
        ChartSeries s1 = new ChartSeries();
        s1.ChartType = ChartType.Area;
        s1.Binding = "Y1";

        // 縦棒グラフの作成
        ChartSeries s2 = new ChartSeries();
        s2.ChartType = ChartType.Column;
        s2.Binding = "Y2";

        // 折れ線グラフの作成
        ChartSeries s3 = new ChartSeries();
        s3.ChartType = ChartType.LineSymbols;
        s3.Binding = "Y3";

        // 折れ線グラフ用のY軸を作成
        ChartAxis AxisY3 = new ChartAxis();
        // 右側に表示
        AxisY3.Position= ChartPositionType.Right;
        AxisY3.TitleText = "Y3のY軸";
        AxisY3.Name = "AxisY3";
        AxisY3.Max = 80; // 右側Y軸の最大値を設定
        AxisY3.Min = 50; // 右側Y軸の最小値を設定
        AxisY3.MajorUnit = 10; // 10を単位に目盛を表示
        // 軸線、グリッド線の表示設定
        AxisY3.AxisLineVisible = true;
        AxisY3.MajorGridVisible= false;

        // 作成したY軸を系列Y3に設定しFlexChartに追加
        s3.AxisY = AxisY3.Name;
        flexchart.Axes.Add(AxisY3);
        flexchart.AxisY.Max = 10; // 既定のY軸の最大値を設定

        // チャートに系列を追加
        flexchart.Series.Clear();
        flexchart.Series.Add(s1);
        flexchart.Series.Add(s2);
        flexchart.Series.Add(s3);
    }

}

Xuni　＞ 技術情報　＞ ドキュメント ＞ FlexChart－機能－複数のY軸