ヒットテスト

ヒットテスト機能を使用すると、ユーザーはタップしたときの X 座標と Y 座標、および FlexChart の任意のポイントのインデックスの値がわかります。このメソッドは、FlexChart の系列外にツールチップを表示するといったシナリオで役立ちます。

次のコード例は、MChart_Tapped イベントを定義する方法を示します。このイベントは、HiTest メソッドを呼び出して、FlexChart 領域内のタップされたポイントの情報を取得します。

次の図は、HitTest 機能を定義した後の FlexChart を示しています。

FlexChart コントロールを初期化して HitTest() メソッドを使用するには、MainActivity.cs を開き、その内容を以下のコードに置き換えます。これは、OnCreate メソッドをオーバーライドします。

CS	コードのコピー
public class MainActivity : Activity { int count = 1; private FlexChart mChart; private TextView mHitTestInfo; private string chartElement; private string chartElementNone; private string pointIndex; private string seriesName; protected override void OnCreate(Bundle savedInstanceState) { base.OnCreate(savedInstanceState); // 「メイン」レイアウトリソースからビューを設定する SetContentView(Resource.Layout.Main); // ウィジェットを初期化する mChart = this.FindViewById<FlexChart>(Resource.Id.flexchart); mHitTestInfo = (TextView)FindViewById(Resource.Id.hitTestInfo); // FlexChartのX軸のバインディングを設定する mChart.BindingX = "Count"; mChart.AxisY.Format = "#.##"; chartElement = this.Resources.GetString(Resource.String.hitTestChartElement); chartElementNone = this.Resources.GetString(Resource.String.hitTestChartElementNone); pointIndex = this.Resources.GetString(Resource.String.hitTestPointIndex); seriesName = this.Resources.GetString(Resource.String.hitTestSeriesName); // 系列要素を初期化し、ChartPointの変数にバインディングを設定する ChartSeries seriesSine = new ChartSeries(); seriesSine.Chart = mChart; seriesSine.SeriesName = "sin(x)"; seriesSine.Binding = "Sine"; ChartSeries seriesCosine = new ChartSeries(); seriesCosine.Chart = mChart; seriesCosine.SeriesName = "cos(x)"; seriesCosine.Binding = "Cosine"; // 個別の系列項目ソースを設定する int len = 40; List<object> list = new List<object>(); for (int i = 0; i < len; i++) { list.Add(new ChartPoint(i, (float)Math.Sin(0.12 * i), (float)Math.Cos(0.12 * i))); } mChart.ItemsSource = list; // リストに系列を追加する mChart.Series.Add(seriesSine); mChart.Series.Add(seriesCosine); mChart.Tapped += MChart_ChartTapped; } private void MChart_ChartTapped(object sender, C1TappedEventArgs e) { C1Point point = e.GetPosition(mChart); ChartHitTestInfo info = mChart.HitTest(point); // タッチイベントごとに hitTestInfo を表示する string displayText = string.Empty; if (info != null) { displayText = chartElement + (info.ChartElement == null ? chartElementNone : info.ChartElement.ToString()); if (info.Item != null) { displayText += "\n" + seriesName + info.Series.Name + "\n" + pointIndex + info.PointIndex; ChartPoint data = (ChartPoint)info.Item; displayText += "\nX : " + data.Count; if (info.Series.Name.Equals("sin(x)")) { displayText += " sin(x) : " + data.Sine; } else { displayText += " cos(x) : " + data.Cosine; } } } else { displayText = "Well, this is not happening.."; } mHitTestInfo.Text = displayText; } }

コードのコピー

public class MainActivity : Activity
{
    int count = 1;
    private FlexChart mChart;
    private TextView mHitTestInfo;

    private string chartElement;
    private string chartElementNone;
    private string pointIndex;
    private string seriesName;

        protected override void OnCreate(Bundle savedInstanceState)
    {
        base.OnCreate(savedInstanceState);

        // 「メイン」レイアウトリソースからビューを設定する
        SetContentView(Resource.Layout.Main);

        // ウィジェットを初期化する
        mChart = this.FindViewById<FlexChart>(Resource.Id.flexchart);
        mHitTestInfo = (TextView)FindViewById(Resource.Id.hitTestInfo);

        // FlexChartのX軸のバインディングを設定する
        mChart.BindingX = "Count";

        mChart.AxisY.Format = "#.##";

        chartElement = this.Resources.GetString(Resource.String.hitTestChartElement);
        chartElementNone = this.Resources.GetString(Resource.String.hitTestChartElementNone);
        pointIndex = this.Resources.GetString(Resource.String.hitTestPointIndex);
        seriesName = this.Resources.GetString(Resource.String.hitTestSeriesName);

        // 系列要素を初期化し、ChartPointの変数にバインディングを設定する
        ChartSeries seriesSine = new ChartSeries();
        seriesSine.Chart = mChart;
        seriesSine.SeriesName = "sin(x)";
        seriesSine.Binding = "Sine";

        ChartSeries seriesCosine = new ChartSeries();
        seriesCosine.Chart = mChart;
        seriesCosine.SeriesName = "cos(x)";
        seriesCosine.Binding = "Cosine";

        // 個別の系列項目ソースを設定する
        int len = 40;
        List<object> list = new List<object>();

        for (int i = 0; i < len; i++)
        {
            list.Add(new ChartPoint(i, (float)Math.Sin(0.12 * i), (float)Math.Cos(0.12 * i)));
        }
        mChart.ItemsSource = list;

        // リストに系列を追加する
        mChart.Series.Add(seriesSine);
        mChart.Series.Add(seriesCosine);

        mChart.Tapped += MChart_ChartTapped;
    }
        
        private void MChart_ChartTapped(object sender, C1TappedEventArgs e)
    {
        C1Point point = e.GetPosition(mChart);
        ChartHitTestInfo info = mChart.HitTest(point);
        // タッチイベントごとに hitTestInfo を表示する
        string displayText = string.Empty;
        if (info != null)
        {
            displayText = chartElement + (info.ChartElement == null ? chartElementNone : info.ChartElement.ToString());
            if (info.Item != null)
            {
                displayText += "\n" + seriesName + info.Series.Name + "\n" + pointIndex + info.PointIndex;
                ChartPoint data = (ChartPoint)info.Item;

                displayText += "\nX : " + data.Count;
                if (info.Series.Name.Equals("sin(x)"))
                {
                    displayText += " sin(x) : " + data.Sine;
                }
                else
                {
                    displayText += " cos(x) : " + data.Cosine;
                }
            }
        }
        else
        {
           displayText = "Well, this is not happening..";
        }
        mHitTestInfo.Text = displayText;
    }
}