如何在 MS 图表中显示带有各种数据的工具提示

Question

我正在用 C# 开发蜡烛图。

我一直致力于使用当前 datagridview 中的数据创建蜡烛图。

另外，当我将光标放在图表的蜡烛点上时，我想显示数据网格视图的信息（开盘价、收盘价、最高价、最低价）。 （见图）

目前正在开发的源代码。

    DataTable table_ChartData = new DataTable();
    table_ChartData.Columns.Add("Id");
    table_ChartData.Columns.Add("Open");
    table_ChartData.Columns.Add("Close");
    table_ChartData.Columns.Add("High");
    table_ChartData.Columns.Add("Low");
    table_ChartData.Columns.Add("Day");
    dataGridView1.DataSource = table_ChartData;  

    chart1.ChartAreas["ChartArea1"].AxisX.MajorGrid.LineWidth = 1;
    chart1.ChartAreas["ChartArea1"].AxisY.MajorGrid.LineWidth = 1;
    chart1.ChartAreas["ChartArea1"].AxisY.Maximum = max;
    chart1.ChartAreas["ChartArea1"].AxisY.Minimum = min;

    chart1.Series["Daily"].XValueMember = "Day";
    chart1.Series["Daily"].YValueMembers = "High,Low,Open,Close";
    chart1.Series["Daily"].XValueType = System.Windows.Forms.DataVisualization.Charting.ChartValueType.Date;

    chart1.Series["Daily"].CustomProperties = "PriceDownColor=Blue,PriceUpColor=Red";
    chart1.Series["Daily"]["OpenCloseStyle"] = "Triangle";
    chart1.Series["Daily"]["ShowOpenClose"] = "Both";

    chart1.DataSource = table_ChartData;
    chart1.DataBind();

    private void chart1_MouseMove(object sender, MouseEventArgs e)
    {

        Point mousePoint = new Point(e.X, e.Y);
        chart1.ChartAreas[0].CursorX.SetCursorPixelPosition(mousePoint, true);
        chart1.ChartAreas[0].CursorY.SetCursorPixelPosition(mousePoint, true);`

        var pos = e.Location;
        if (prevPosition.HasValue && pos == prevPosition.Value)
            return;
        tooltip.RemoveAll();
        prevPosition = pos;
        var results = chart1.HitTest(pos.X, pos.Y, false, ChartElementType.DataPoint); // set ChartElementType.PlottingArea for full area, not only DataPoints
        foreach (var result in results)
        {
            if (result.ChartElementType == ChartElementType.DataPoint) // set ChartElementType.PlottingArea for full area, not only DataPoints
            {
                var yVal = result.ChartArea.AxisY.PixelPositionToValue(pos.Y);
                tooltip.Show(((int)yVal).ToString(), chart1, pos.X, pos.Y - 15);
            }
        }

    }

感谢您的帮助。谢谢你:)

Answer 1

您正在MouseMove 中创建ToolTips；这是一种方法，但最简单的方法是通过在创建 DataPoints.. 时设置 DataPoint.Tooltip 属性来让 Chart 完成工作：

DataPoint dp = new DataPoint (..);
dp.ToolTip = "x=" + dp.XValue + "\n high=" + dp.YValues[0]+ "\n low=" + dp.YValues[1] + ..;
yourSeries.Points.Add(dp);

---

.. 或者，如果点是 DataBound，则在绑定后立即添加 ToolTips，或者将它们包含在绑定本身中。

请注意，只有部分various data binding methods 允许您绑定工具提示等“扩展图表属性”。 Points.DataBind 被明确提及。这意味着您需要为数据源中的工具提示准备一个字段，因为我知道无法在 otherField 字符串中编写连接表达式..

如果您的数据位于DataTable 中并带有以下字段，则可以使用如下语法进行绑定：

var enumerableTable = (dt as System.ComponentModel.IListSource).GetList();
yourSeries.Points.DataBind(enumerableTable, "x-col", 
                          "highField, lowField..", "Tooltip=tooltipField");

---

如果您想在 MouseMove 中执行此操作，您可以轻松获得对 DataPoint 的引用（如果有的话），并使用其所有值（如上）..：

DataPoint dp = null;
if (results.PointIndex >= 0 && results.ChartElementType == ChartElementType.DataPoint)
{
    dp = results.Series.Points[hitt.PointIndex];
    string tText = "x=" + dp.XValue + "\n high=" + 
                   dp.YValues[0]+ "\n low=" + dp.YValues[1] + ..;
..
}

请注意，HitTest 结果是一个具有多个属性的对象。无需循环！