ASP.Net 中的图表助手显示日期时间

Question

在 asp.net mvc 应用程序中，我需要创建一个简单的折线图，所以我尝试了 Chart helper。该图表是使用两个列表创建的，x 轴应显示日期时间，y 轴应显示每次的值。现在使用下面的代码可以正常工作。“listOfDateTimes”包含一个日期时间列表。

    var chart = new Chart(width: 1000, height: 300, theme: ChartTheme.Green)
        .AddSeries(
                    chartType: "line",
                    xValue: listOfDateTimes,
                    yValues:  listOfValues )
                    .GetBytes("png");

问题是 x 轴下方的日期时间显示为“MM/dd/yyyy”，但我还需要显示小时和分钟。我不知道如何使用图表助手解决这个问题。

Answer 1

使用 Chart Helper 时，您必须通过提供自己的主题文件来自定义图表：

 var myChart = new Chart(width: 800, height: 400, themePath: "MyTheme3.xml")
              .AddSeries(
                          chartType: "line",
                          xValue: new[] { DateTime.Now,
                              DateTime.Now.AddSeconds(1),
                              DateTime.Now.AddSeconds(2),
                              DateTime.Now.AddSeconds(3),
                              DateTime.Now.AddSeconds(4) },
                          yValues: new[] { 40, 100, 60, 80, 20 })

使用此示例主题自定义您的 X 轴，如下所述：

MyTheme3.xml：

<?xml version="1.0" encoding="utf-8" ?>
<Chart>
  <ChartAreas>
    <ChartArea Name="Default">
      <AxisX>
        <LabelStyle Format="MM/dd/yyyy hh:mm:ss"></LabelStyle>
      </AxisX>
    </ChartArea>
  </ChartAreas>
  <Series>
    <Series Name="Default"></Series>
  </Series>
</Chart>

编辑：如果您想通过属性以常规方式配置图表，那么您应该使用System.Web.UI.DataVisualization.Charting命名空间。但是如果你想使用System.Web.Helpers命名空间，那么你必须像之前解释的那样去做。