通过前面基础篇一介绍后，我想大家应该对visifire有了一定的了解了吧，下面在给大家看一个visifire的效果图吧，如图所以：

这个效果是不是挺炫，想要实现这样的效果吗，哈哈，下面我就废话不多说了，直接上代码：

第一步：前台代码

　　

第二步：后台代码：

1.create chart：在后台创建chart

#region Create a chart        public void CreateMyChart(DataTable dtChart, Chart chart, RenderAs renderAs, Double opacity)        {            //绑定Chart            chart.Series.Clear();            chart.Titles.Clear();            chart.ScrollingEnabled = false;            chart.AnimationEnabled = true;            chart.ThemeEnabled = true;            chart.View3D = true;            DataSeries dataSeries = new DataSeries();            //Chart的实例这是以饼图显示                                                        // Set DataSeries property            dataSeries.RenderAs = renderAs;            dataSeries.Opacity = opacity;            dataSeries.Bevel = false;            dataSeries.MarkerType = Visifire.Commons.MarkerTypes.Triangle;            DataPoint datapoint;            for (int i = 0; i < dtChart.Rows.Count; i++)            {                datapoint = new DataPoint();                if (renderAs == RenderAs.Line)                {                    datapoint.MarkerEnabled = true;                    datapoint.MarkerSize = 8;                    datapoint.MarkerColor = datapoint.Color;                }                datapoint.AxisXLabel = dtChart.Rows[i]["job_id"].ToString();                datapoint.YValue = Convert.ToDouble(dtChart.Rows[i]["max_lvl"].ToString());                dataSeries.DataPoints.Add(datapoint);            }            //绑定当鼠标放上去显示的信息                       dataSeries.LabelText = "#AxisXLabel, #YValue";            chart.Series.Add(dataSeries);            Title title = new Title();            title.Text = "某某医院...";            chart.Titles.Add(title);            chart.IndicatorEnabled = true;            chart.ShadowEnabled = true;        }        #endregion

　　

2.load ：加载时需要绑定chart，以及Plotarea的实现

public VisifireWindow2()        {            InitializeComponent();            DataSet ds = DBSQLHelper.Search("select * from jobs", null, CommandType.Text);             CreateMyChart(ds.Tables[0], Chart1, RenderAs.Line, 1);            CreateMyChart(ds.Tables[0], Chart2, RenderAs.Column, 1);             Chart1.PlotArea.MouseMove += new EventHandler
      
       (PlotArea_MouseMove);             Chart1.PlotArea.MouseLeave += new EventHandler
       
        (PlotArea_MouseLeave);             Chart2.PlotArea.MouseMove += new EventHandler
        
         (PlotArea2_MouseMove);             Chart2.PlotArea.MouseLeave += new EventHandler
         
          (PlotArea2_MouseLeave);        }
         
        
       
      

3.plotarea：两个chart，mousemove和mouseleave事件的实现效果的关键代码

#region Chart2'PlotArea        /// 
        /// MouseMove event handler, it will enabled ShowIndicator for Chart1        /// 
        ///         ///         void PlotArea2_MouseMove(object sender, PlotAreaMouseEventArgs e)        {            Chart1.ShowIndicator(e.XValue, e.YValue);        }        /// 
        /// MouseLeave  event handler, it will disabled ShowIndicator for Chart1        /// 
        ///         ///         void PlotArea2_MouseLeave(object sender, MouseEventArgs e)        {            Chart1.HideIndicator();        }        #endregion        #region Chart1'PlotArea        /// 
        /// MouseMove event handler, it will enabled ShowIndicator for Chart2        /// 
        ///         ///         void PlotArea_MouseMove(object sender, PlotAreaMouseEventArgs e)        {            Chart2.ShowIndicator(e.XValue, e.YValue);        }        /// 
        /// MouseLeave event handler, it will disabled ShowIndicator for Chart2        /// 
        ///         ///         void PlotArea_MouseLeave(object sender, MouseEventArgs e)        {            Chart2.HideIndicator();        }        #endregion

　　

 

　　哈哈哈，这样就可以了，麻烦大家多提提意见哦！