图表 – 放大以显示更精确的数据

所以我现在有一张图表,其中包含大量数据。 这可以在下图中看到:

在此处输入图像描述

基本上我希望用户能够放大并进一步查看数据。 正如您所知,它目前已经携带了大量数据。

我希望用户能够缩放并查看更精确的内容。

protected void drawChart() { DataTable dt = new DataTable(); dt.Clear(); foreach (DataGridViewColumn col in dataGridView1.Columns) { dt.Columns.Add(col.HeaderText); } foreach (DataGridViewRow row in dataGridView1.Rows) { DataRow dRow = dt.NewRow(); foreach (DataGridViewCell cell in row.Cells) { dRow[cell.ColumnIndex] = cell.Value; } dt.Rows.Add(dRow); } chart1.DataBind(); chart1.DataSource = dt; chart1.ChartAreas[0].AxisX.IntervalAutoMode = IntervalAutoMode.VariableCount; chart1.ChartAreas[0].AxisX.LabelStyle.Angle = 90; chart1.Series["Series1"].XValueMember = "Date/Time"; chart1.Series["Series1"].YValueMembers = "HeartRate"; chart1.Series["Series2"].ChartType = SeriesChartType.Line; chart1.Series["Series2"].YValueMembers = "Speed"; chart1.Series["Series3"].ChartType = SeriesChartType.Line; chart1.Series["Series3"].YValueMembers = "Cadence"; chart1.Series["Series4"].ChartType = SeriesChartType.Line; chart1.Series["Series4"].YValueMembers = "Altitude"; chart1.Series["Series5"].ChartType = SeriesChartType.Line; chart1.Series["Series5"].YValueMembers = "Pressure"; chart1.Series["Series6"].ChartType = SeriesChartType.Line; chart1.Series["Series6"].YValueMembers = "Power"; chart1.Series["Series1"].LegendText = "Heart Rate"; chart1.Series["Series1"].ToolTip = "Heart Rate:#VALY\nAverage:#AVG\nMinimum:#MIN\nMaximum:#MAX "; chart1.Series["Series2"].LegendText = "Speed"; chart1.Series["Series2"].ToolTip = "Speed(KM/H):#VALY\nAverage:#AVG\nMaximum:#MAX"; chart1.Series["Series3"].LegendText = "Cadence"; chart1.Series["Series3"].ToolTip = "Cadence:#VALY\nAverage:#AVG\nMaximum:#MAX"; chart1.Series["Series4"].LegendText = "Altitude"; chart1.Series["Series4"].ToolTip = "Altitude(KM/H):#VALY\nAverage:#AVG\nMaximum:#MAX"; chart1.Series["Series5"].LegendText = "Pressure"; chart1.Series["Series5"].ToolTip = "Pressure:#VALY\nAverage:#AVG\nMaximum:#MAX"; chart1.Series["Series6"].LegendText = "Power"; chart1.Series["Series6"].ToolTip = "Power:#VALY\nAverage:#AVG\nMaximum:#MAX"; // add the highlight series after databinding!! (**) Series sz = chart1.Series.Add("Interval"); sz.ChartType = SeriesChartType.Point; sz.Color = Color.Red; sz.BorderWidth = 3; foreach (DataPoint dp in chart1.Series[0].Points) { if (dp.YValues[0] == 0) sz.Points.AddXY(dp.XValue, 0); } // allow zooming: (Taw's edit) chart1.Series["Series1"].AxisX.ScaleView.Zoomable = true; chart1.Series["Series1"].CursorX.AutoScroll = true; chart1.Series["Series1"].CursorX.IsUserSelectionEnabled = true; } 

这很容易,但确实需要一些设置才能完成:

 ChartArea CA = chart1.ChartAreas[0]; // quick reference CA.AxisX.ScaleView.Zoomable = true; CA.CursorX.AutoScroll = true; CA.CursorX.IsUserSelectionEnabled = true; 

现在,用户可以将鼠标拖动到感兴趣的区域上,然后将其放大以填充图表:

在此处输入图像描述在此处输入图像描述

请注意水平滚动条左侧的小按钮:这会重置范围。

Chart ,问题是结构不完整的文档。