如何将图表控件宽度设置为百分比答案

【问题标题】：How to set Chart control width into percentage如何将图表控件宽度设置为百分比
【发布时间】：2017-10-19 17:03:17
【问题描述】：

在asp.net图表控件中，我们如何将图表宽度设置为百分比，下面的场景是图表宽度需要与面板宽度一起设置。因为图表只需要像素。这方面的帮助。

<table style="width:100%;">
<tr>
<td style="width:50%;border:1px solid black;"> 
<asp:Panel ID="pnl" runat="server" Width="100%">
<asp:Chart ID="Chart2" runat="server" >
<Titles><asp:Title Text="ChartSample1"></asp:Title></Titles>
<Series>
<asp:Series Name="Series1"></asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1"></asp:ChartArea>
</ChartAreas>
</asp:Chart>
</asp:Panel>
</td>
<td style="width:50%;border:1px solid black;"> 
<asp:Panel ID="pnl2" runat="server" Width="100%">
<asp:Chart ID="Chart3" runat="server">
<Titles><asp:Title Text="ChartSample2"></asp:Title></Titles>
<Series>
<asp:Series Name="Series1"></asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1"></asp:ChartArea>
</ChartAreas>
</asp:Chart>
</asp:Panel>
</td>
</tr>
</table>

后面的代码： protected void Page_Load(object sender, EventArgs e) {

Chart2.Series[0].Points.AddXY(1, 1);
Chart2.Series[0].Points.AddXY(1, 2);
Chart2.Series[0].Points.AddXY(2, 1);
Chart2.Series[0].Points.AddXY(2, 2);
Chart2.Series[0].Points.AddXY(3, 1);
Chart2.Series[0].Points.AddXY(3, 2);

Chart3.Series[0].Points.AddXY(1, 10);
Chart3.Series[0].Points.AddXY(1, 20);
Chart3.Series[0].Points.AddXY(2, 10);
Chart3.Series[0].Points.AddXY(2, 20);
Chart3.Series[0].Points.AddXY(3, 10);
Chart3.Series[0].Points.AddXY(3, 20);

}

【问题讨论】：

你能做到<asp:Chart ID="Chart3" runat="server" style="width:100%"> 并省去面板吗？（或者，更好的是，不要使用表格进行布局 - 现在是 21 世纪 - 而是使用浮动面板来并排放置）
谢谢，但是当添加 style="width:100%" 时，图表宽度会被拉伸（因为这里的图表是图像）。
您说“图表宽度应设置为面板宽度”。面板宽度为 100%。所以如果把图表设置为100%，和面板一样，难免会拉长。还会发生什么？但这是你要求的:-)
我需要图表不应该被拉伸，我怎样才能做到这一点。请帮助
那么你想要什么？如果将其扩展至全宽，它将被拉伸。如果你不这样做，它不会被拉伸，但会有一个间隙。你想让它在 div 中居中吗？

标签： asp.net

【解决方案1】：

如果您还没有找到解决方案，您可以尝试在代码隐藏中获取panel 的width 和height 属性。我更喜欢在网站上使用panels 而不是table。

double heightTable = panel1.height.value;

chart2.height = new unit(heighttable);

【讨论】：