C# chart，有关如何在鼠标移动到Series上时显示节点及数据（有待继续更新）

时间：2016-09-11 20:22:10 阅读：13501 评论：0 收藏：0 [点我收藏+]

标签：

一、效果与思路

效果：
技术分享

解决方案1

用chart的mousemove时间，实时跟踪鼠标最近的X轴的位置，然后把cursorX设置到那个位置上，让用户知道我是选的那一个X的值，同时用tooltip显示该X轴上所有的Y值，结贴了谢谢大家。

至于如何显示鼠标移动到的那个series上的数据节点，可以在Mousmove时，用一个击中测试，判断。

参考代码，击中测试获得点数据点的索引：

if (e.HitTestResult.ChartElementType == ChartElementType.DataPoint)
{
    int i = e.HitTestResult.PointIndex;
    DataPoint dp = e.HitTestResult.Series.Points[i];
    e.Text = string.Format("{1:F3}", dp.XValue, dp.YValues[0]);
}

解决方案2

用的是vs的chart控件。我在页面上的chart中写的是这种方式显示tooltip的（chart1是我的chart的名字）
chart1.GetToolTipText += new EventHandler<ToolTipEventArgs>(chart_GetToolTipText);
void chart_GetToolTipText(object sender, ToolTipEventArgs e)
        {
            if (e.HitTestResult.ChartElementType == ChartElementType.DataPoint)
            {
                int i = e.HitTestResult.PointIndex;
                DataPoint dp = e.HitTestResult.Series.Points[i];
                e.Text = string.Format("{1:F3}", dp.XValue, dp.YValues[0]);
            }
        }
但是这个鼠标悬停的判断范围也好窄好窄好窄好窄，选一个点要选半天，鼠标晃来晃去都不能出现tooltip，这个根本没办法用。请问高手有没有好的方式可以让图形可以容忍一定的偏斜，就是说即使没有选到这个点，到这个点附近多少范围之类也可以出现tooltip
思路：
1、记得以前有一个软件，当你的鼠标移动到你需要指点的附近时，它就会“磁吸”到点那里去，你也可以这样，挑最近的吸过去。
2、如果你开发的是分析软件，而且精度要求很高的话，建议采用加粗放大方式，点击后“标点”再缩小回去。

参考

#VALX         //x轴数据
#VALY         //y轴数据
#PERCENT      //百分比
#AVG          //平均值
#INDEX        //索引值
#MAX          //最大值
#MIN          //最小值
#TOTAL        //合计
#LEGENDTEXT   //显示Legend的text
#SER          //显示Series名称

二、参考示例

ChartControl.RuntimeHitTesting属性一定要设为True。

Line Series markers的Visible一定要弄成True。CalcHitInfo的SeriesPoint一直为null，最后跑到devexpress support center上问的。我的dev版本是13.1.5，设置属性的方法是Series->View->MarkerVisibility。有的版本可能是Series -> LineMarkerOptions -> Visible。

我的是以曲线图Spline为例，下面就是代码。

1.鼠标点击点弹出Messagebox

    private void chartControl4_MouseClick(object sender, MouseEventArgs e)  
    {  
        ChartHitInfo hitInfo = chartControl4.CalcHitInfo(e.Location);  
        if (hitInfo.SeriesPoint != null)  
        {  
            MessageBox.Show(hitInfo.SeriesPoint.Values[0].ToString());  
        }  
    }

技术分享

2.鼠标移动用ToolTipController显示值

外面定义

ToolTipController toolTipController = new ToolTipController();

下面是dev的源码：

    private void chartControl4_MouseMove(object sender, MouseEventArgs e)  
    {  
        ChartHitInfo hitInfo = chartControl4.CalcHitInfo(e.Location);  
        StringBuilder builder = new StringBuilder();  
        if (hitInfo.InDiagram)  
            builder.AppendLine("In diagram");  
        if (hitInfo.InNonDefaultPane)  
            builder.AppendLine("In non-default pane: " + hitInfo.NonDefaultPane.Name);  
        if (hitInfo.InAxis)  
        {  
            builder.AppendLine("In axis: " + hitInfo.Axis.Name);  
            if (hitInfo.AxisLabelItem != null)  
                builder.AppendLine("  Label item: " + hitInfo.AxisLabelItem.Text);  
            if (hitInfo.AxisTitle != null)  
                builder.AppendLine("  Axis title: " + hitInfo.AxisTitle.Text);  
        }  
        if (hitInfo.InChartTitle)  
            builder.AppendLine("In chart title: " + hitInfo.ChartTitle.Text);  
        if (hitInfo.InLegend)  
            builder.AppendLine("In legend");  
        if (hitInfo.InSeries)  
            builder.AppendLine("In series: " + ((Series)hitInfo.Series).Name);  
        if (hitInfo.InSeriesLabel)  
        {  
            builder.AppendLine("In series label");  
            builder.AppendLine("  Series: " + ((Series)hitInfo.Series).Name);  
        }  
        if (hitInfo.SeriesPoint != null)  
        {  
            builder.AppendLine("  Argument: " + hitInfo.SeriesPoint.Argument);  
            if (!hitInfo.SeriesPoint.IsEmpty)  
                builder.AppendLine("  Value: " + hitInfo.SeriesPoint.Values[0]);  
        }  
        if (builder.Length > 0)  
            toolTipController.ShowHint("Hit-testing results:\n" + builder.ToString(), chartControl4.PointToScreen(e.Location));  
        else  
            toolTipController.HideHint();  
    }

View Code

MouseLeave事件代码

    private void chartControl4_MouseLeave(object sender, EventArgs e)  
    {  
        toolTipController.HideHint();  
    }

技术分享

3.另一种鼠标移动显示信息的方法，用CustomDrawCrosshair事件，从别人那里学习的。这种还可以显示图片。

    private void chartControl4_CustomDrawCrosshair(object sender, CustomDrawCrosshairEventArgs e)  
    {  
      
        foreach (CrosshairElement element in e.CrosshairElements)  
        {  
            SeriesPoint point = element.SeriesPoint;  
            element.LabelElement.MarkerImage = Image.FromFile(@"F:\Resources\Add.png");// 设置图片路径  
            element.LabelElement.MarkerImageSizeMode = ChartImageSizeMode.Stretch;  
            element.LabelElement.MarkerSize = new Size(100, 100); // 大小  
            element.LabelElement.Text = point.Values[0].ToString();//显示要显示的文字  
        }  
    }

技术分享