在System.Web.UI.DataVisualization.Charting中显示有关鼠标悬停的系列数据的工具提示

时间:2014-12-29 08:41:39

标签: asp.net tooltip mschart

我正在使用System.Web.UI.DataVisualization.Charting来创建一些折线图。当鼠标悬停在一个系列的数据点上时,我想显示工具提示(数据点的x和y值)。 如图表图像所示,当鼠标悬停在红色圆圈上时,我想要一个工具提示。 chart image

我添加了series.ToolTip方法但是,它不起作用。 这是我的createSeries meothod

   private System.Web.UI.DataVisualization.Charting.Series CreateSeries(List<X> xAxisData, List<Y> yAxisdata)
    {
        // Chart Series
        System.Web.UI.DataVisualization.Charting.Series _series =
            new System.Web.UI.DataVisualization.Charting.Series(this.SeriesNameList[this.seriesCount]);
        _series.ChartType = this.ChartType;

        // Bind the data
        _series.Points.DataBindXY(xAxisData, yAxisdata);

        // Set Default Properties
        _series.Font = this.GetFontForSeries();
        _series.LabelForeColor = this.GetLabelColor();

        // Add Transparent Marker to increase mouse area for ToolTip
        _series.MarkerStyle = System.Web.UI.DataVisualization.Charting.MarkerStyle.Circle;
        _series.MarkerSize = 7;
        _series.ToolTip = "hello";

        //// Smart Labels
        _series.SmartLabelStyle.Enabled = true;
        _series.SmartLabelStyle.MinMovingDistance = 5;
        _series.SmartLabelStyle.MaxMovingDistance = 50;
        _series.SmartLabelStyle.MovingDirection =
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Top |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.TopLeft |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.TopRight |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Bottom |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.BottomLeft |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.BottomRight |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Left |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Right |
            System.Web.UI.DataVisualization.Charting.LabelAlignmentStyles.Center;
        _series.SmartLabelStyle.IsOverlappedHidden = true;
        _series.SmartLabelStyle.AllowOutsidePlotArea = System.Web.UI.DataVisualization.Charting.LabelOutsidePlotAreaStyle.Yes;

        this.seriesCount++;
        return _series;
    }
 private void InitializeChart()
    {
        this.Chart.IsMapEnabled = false;

        this.Chart.RenderType = System.Web.UI.DataVisualization.Charting.RenderType.ImageTag;
        this.Chart.ImageType = System.Web.UI.DataVisualization.Charting.ChartImageType.Png;
        this.Chart.AntiAliasing = System.Web.UI.DataVisualization.Charting.AntiAliasingStyles.Graphics;
        this.Chart.TextAntiAliasingQuality = System.Web.UI.DataVisualization.Charting.TextAntiAliasingQuality.High;
        this.CreateTitle();
        this.CreateLegends();
    }

有人能帮助我吗? 我搜索了一些问题,但无法找到解决方案。

1 个答案:

答案 0 :(得分:0)

您需要将工具提示添加到点。

Points.DataBindXY没有办法绑定扩展图表属性,如工具提示。 (Points.DataBind似乎,顺便说一句) 资料来源:http://blogs.msdn.com/b/alexgor/archive/2009/02/21/data-binding-ms-chart-control.aspx

因此,解决方法是循环遍历系列点并手动将工具提示添加到点。你可以使用/修改下面的代码。 (#VALX和#VAL是添加XY坐标而不直接读取值的一种方法,另一种方法是直接读取XY值)

// Bind the data
_series.Points.DataBindXY(xAxisData, yAxisdata);

// Set Tooltips
foreach(var point in _series.Points)
{
    point.ToolTip = "(#VALX, #VAL)"; 
}

// Set Default Properties
_series.Font = this.GetFontForSeries();
_series.LabelForeColor = this.GetLabelColor();

不使用关键字的替代方式:

// Bind the data
_series.Points.DataBindXY(xAxisData, yAxisdata);

// Set Tooltips
foreach(var point in _series.Points)
{
    point.ToolTip = "(" + point.X + ", " + point.YValues[0] + ")"; 
}

// Set Default Properties
_series.Font = this.GetFontForSeries();
_series.LabelForeColor = this.GetLabelColor();