Question

我正在使用System.Web.UI.DataVisualization.Charting.Chart并尝试绘制置换栏，但不是这样：另一种方式：

我的意思是，我想从第1点开始绘制条形图并向右移动55px。

我实现了这个目标：

使用以下代码：

Chart1.Series.Clear();

    int[,] horas = new int[,] { { 0, 1 }, { 1, 1 }, { 2, 0 }, { 3, 1 }, { 4, 0 }, { 5, 1 }, { 6, 0 }, { 7, 0 }, { 8, 1 }, { 9, 1 } };
    Chart1.DataSource = horas;
    var series1 = new Series
    {
        Color = System.Drawing.Color.Green,
        IsVisibleInLegend = false,
        IsXValueIndexed = true,
        ChartType = SeriesChartType.RangeColumn,
    };
    series1["PixelPointWidth"] = "1";

    int[,] horas1 = new int[,] { { 0, 1 }, { 1, 1 }, { 2, 0 }, { 3, 1 }, { 4, 0 }, { 5, 1 }, { 6, 0 }, { 7, 0 }, { 8, 1 }, { 9, 1 } };
    var series2 = new Series
    {
        Color = System.Drawing.Color.Green,
        IsVisibleInLegend = false,
        IsXValueIndexed = true,
        ChartType = SeriesChartType.RangeColumn
    };
    series2["PixelPointWidth"] = "110";

    for (int i = 0; i < horas.GetLength(0); i++)
    {
        series1.Points.AddXY(horas[i, 0], horas[i, 1]);
    }
    for (int i = 0; i < horas.GetLength(0); i++)
    {
        series2.Points.AddXY(horas1[i, 0], horas1[i, 1]);
    }

    int b = 0;
    foreach (var label in Chart1.ChartAreas[0].AxisX.CustomLabels)
    {
        label.Text = b.ToString();
        b++;
    }

    Chart1.Series.Add(series1);
    Chart1.Series.Add(series2);

    Chart1.ChartAreas[0].AxisY.Interval = 0;
    Chart1.ChartAreas[0].AxisX.Interval = 1;
    Chart1.ChartAreas[0].AxisY.Maximum = 1;
    Chart1.ChartAreas[0].AxisY.Minimum = 0;

    Chart1.ChartAreas[0].AxisX.MajorGrid.LineWidth = 0;
    Chart1.ChartAreas[0].AxisY.MajorGrid.LineWidth = 0;
    Chart1.DataBind();

但这不是最佳解决方案，因为我必须在我不想要的一侧画出至少1个像素。

我很感激有关如何实现目标的任何解决方案或建议。 Thx提前。

编辑。这适用于使用.NET 4.5 Framework中的VS 2015 Professional开发的IIS 6.0下的Windows Server 2012

编辑：我的意思是右边55 px，但最好的解决方案是X轴的下一个点

编辑：这是web.config的内容。

    <configuration>
  <appSettings>
    <add key="ChartImageHandler" value="storage=file;timeout=20;dir=c:\TempImageFiles\;" />
  </appSettings>
  <system.webServer>
    <validation validateIntegratedModeConfiguration="false" />
    <handlers>
      <remove name="ChartImageHandler" />
      <add name="ChartImageHandler" preCondition="integratedMode" verb="GET,HEAD,POST"
        path="ChartImg.axd" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
    </handlers>
  </system.webServer>
  <system.web>
    <httpHandlers>
      <add path="ChartImg.axd" verb="GET,HEAD,POST" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
        validate="false" />
    </httpHandlers>
    <pages>
      <controls>
        <add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting"
          assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
      </controls>
    </pages>
    <compilation debug="true" targetFramework="4.5">
      <assemblies>
        <add assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
      </assemblies>
    </compilation>
    <httpRuntime targetFramework="4.5"/>
  </system.web>
</configuration>

Answer 1

您应该使用CustomLabels简单地移动轴标签，而不是尝试绘制移位的图表栏。

<强> ASPX：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Chart ID="Chart1" runat="server" Height="600px" Width="800px" >
                <ChartAreas>
                    <asp:ChartArea Name="ChartArea1">
                        <AxisY>
                            <MajorGrid LineColor="DarkGray" LineDashStyle="Dot" />
                        </AxisY>
                        <AxisX>
                            <MajorGrid LineColor="DarkGray" LineDashStyle="Dot" />
                        </AxisX>
                    </asp:ChartArea>
                </ChartAreas>
            </asp:Chart>
        </div>
    </form>
</body>
</html>

<强> CS：

public partial class WebForm1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        int[,] horas = new int[,] { { 0, 1 }, { 1, 1 }, { 2, 0 }, { 3, 1 }, { 4, 0 }, { 5, 1 }, { 6, 0 }, { 7, 0 }, { 8, 1 }, { 9, 1 } };

        var series1 = new Series
        {
            Color = Color.Green,
            IsVisibleInLegend = false,
            IsXValueIndexed = true,
            ChartType = SeriesChartType.RangeColumn,
            CustomProperties = "PointWidth=0.8"
        };

        for (int i = 0; i < horas.GetLength(0); i++)
        {
            series1.Points.AddXY(horas[i, 0], horas[i, 1]);
        }

        Chart1.Series.Add(series1);

        Chart1.ChartAreas[0].AxisX.Interval = 1;

        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 0, ToPosition = 1, Text = "0", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 1, ToPosition = 2, Text = "1", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 2, ToPosition = 3, Text = "2", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 3, ToPosition = 4, Text = "3", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 4, ToPosition = 5, Text = "4", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 5, ToPosition = 6, Text = "5", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 6, ToPosition = 7, Text = "6", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 7, ToPosition = 8, Text = "7", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 8, ToPosition = 9, Text = "8", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 9, ToPosition = 10, Text = "9", GridTicks = GridTickTypes.All });
        Chart1.ChartAreas[0].AxisX.CustomLabels.Add(new CustomLabel { FromPosition = 10, ToPosition = 11, Text = "10", GridTicks = GridTickTypes.All });
    }
}

Answer 2

我的建议是使用图表/图表库：

Google（https://developers.google.com/chart/）
FusionCharts（https://www.fusioncharts.com/）
Chartjs（http://www.chartjs.org/）
D3js（https://d3js.org/）

如何在ASP.NET图表

2 个答案: