如何将MS Chart的X轴设置为日期时间格式,实现类似TradingView的显示效果
解决方案
1. 配置X轴自适应日期格式(类TradingView效果)
TradingView的X轴会根据当前可视时间跨度自动切换显示精度,可通过以下代码实现相同逻辑:
// 初始化X轴基础属性 var xAxis = chart1.ChartAreas[0].AxisX; xAxis.ValueType = ChartValueType.DateTime; // 明确指定X轴为日期时间类型 xAxis.IntervalType = DateTimeIntervalType.Auto; // 自动计算刻度间隔 xAxis.IsLabelAutoFit = true; xAxis.LabelAutoFitStyle = LabelAutoFitStyles.LabelsAngleStep30 | LabelAutoFitStyles.WordWrap; // 绑定缩放视图变化事件,根据可视范围切换日期显示格式 xAxis.ScaleView.ViewChanged += (s, e) => { var viewRange = xAxis.ScaleView.ViewMaximum - xAxis.ScaleView.ViewMinimum; // OADate数值1代表1天,按时间跨度匹配显示格式 if (viewRange >= 30) // 可视范围超过30天显示年月 xAxis.LabelStyle.Format = "yyyy-MM"; else if (viewRange >= 1) // 可视范围1-30天显示月日 xAxis.LabelStyle.Format = "MM-dd"; else if (viewRange >= 1/24.0) // 可视范围1小时-1天显示月日+时分 xAxis.LabelStyle.Format = "MM-dd HH:mm"; else // 可视范围小于1小时显示时分秒 xAxis.LabelStyle.Format = "HH:mm:ss"; };
- 确认数据绑定阶段传入
AddXY的第一个参数是DateTime类型,不要做ToString转换,否则X轴会识别为字符串索引,所有日期计算逻辑都会失效 - 如果需要固定X轴的最小最大值,可以在绑定完数据后手动设置
xAxis.Minimum和xAxis.Maximum,避免自动计算时出现边界留白
2. 修复鼠标滚轮缩放逻辑
原代码缩放时左右比例不一致,导致只能从左到右缩放、光标居中时位置偏移,修改为以光标为中心的缩放逻辑:
private void chart1_MouseWheel(object sender, MouseEventArgs e) { try { Axis xAxis = chart1.ChartAreas[0].AxisX; if (!xAxis.ScaleView.IsZoomed) { // 未缩放时初始范围设为全数据范围 xAxis.ScaleView.Zoom(xAxis.Minimum, xAxis.Maximum); } double xMin = xAxis.ScaleView.ViewMinimum; double xMax = xAxis.ScaleView.ViewMaximum; double xPixelPos = xAxis.PixelPositionToValue(e.Location.X); double range = xMax - xMin; double zoomFactor = e.Delta > 0 ? 0.75 : 1.25; // 统一缩放系数 double newRange = range * zoomFactor; // 计算新的起止位置,保持光标所在位置固定 double posXStart = xPixelPos - (xPixelPos - xMin) * zoomFactor; double posXFinish = xPixelPos + (xMax - xPixelPos) * zoomFactor; // 边界校验,避免超出数据范围 posXStart = Math.Max(posXStart, xAxis.Minimum); posXFinish = Math.Min(posXFinish, xAxis.Maximum); xAxis.ScaleView.Zoom(posXStart, posXFinish); FZoomLevel = e.Delta > 0 ? FZoomLevel+1 : FZoomLevel-1; } catch { } }
3. 修复Tooltip X轴值显示问题
原代码中拿到的xCord是OADate格式的浮点数值,需要转换为DateTime类型再格式化输出:
private void chart1_GetToolTipText(object sender, ToolTipEventArgs e) { System.Windows.Forms.DataVisualization.Charting.HitTestResult htr = chart1.HitTest(e.X, e.Y); if (htr.ChartElementType != ChartElementType.PlottingArea && htr.ChartElementType != ChartElementType.DataPoint && htr.ChartElementType != ChartElementType.Gridlines && htr.ChartElementType!= ChartElementType.Axis) return; ChartArea ca = chart1.ChartAreas[0]; double yCoord = ca.AxisY2.PixelPositionToValue(e.Y); double xCord = ca.AxisX.PixelPositionToValue(e.X); // OADate转DateTime DateTime xTime = DateTime.FromOADate(xCord); e.Text = $"Y = {Math.Round(yCoord, 2)}\nX = {xTime:yyyy-MM-dd HH:mm}"; }
内容的提问来源于stack exchange,提问作者YoungDisciple
相关产品推荐
相关产品推荐

