在JavaScript中更改图表的高度和宽度属性

时间:2019-03-20 16:15:59

标签: javascript c# html visual-studio

我有这个按钮,单击该按钮可以缩小图表的尺寸,但是它不起作用。 我不想更改样式的height和width属性,因为这会使图表看起来很拉伸。这就是为什么我试图更改图表元素中的属性。

 <script type="text/javascript">
        function downSize() {
            document.getElementById("chart1").Height = "350px";
            document.getElementById("chart1").Width = "600px";  
        }
    </script>

<!--Button-->
<asp:LinkButtonrunat="server" Text="DownSize" ID="DownSize" class="btn btn info" onClientClick="downSize()"></asp:LinkButton>

  <!--Graph-->
  <asp:Chart ID="chart1" runat="server"   EnableViewState="True" Height = "650px" Width = "1200px">
            <Legends>
                <asp:Legend Name="Legend">
                </asp:Legend>
            </Legends>
            <ChartAreas>
                <asp:ChartArea Name="DefaultChartArea" BorderColor="Gainsboro">
                    <AxisY >
                        <MajorGrid LineColor="LightSteelBlue" />
                        <MajorTickMark LineColor="Transparent" />
                    </AxisY>
                    <AxisX>
                        <MajorGrid LineColor="LightSteelBlue" />
                        <MajorTickMark LineColor="Transparent" />
                    </AxisX>
                </asp:ChartArea>
            </ChartAreas>
            <BorderSkin BackColor="Transparent" BorderColor="Transparent" BorderDashStyle="DashDot" SkinStyle="Emboss" />
</asp:Chart>

单击该按钮时,似乎重新加载了图表,但其大小与以前相同。我还添加了一个document.write(“ Hello”),以确保该按钮正在激活该功能并且可以正常工作,因此图形或脚本似乎有问题。

为什么代码不起作用?

1 个答案:

答案 0 :(得分:0)

Hieght和Width是ASP控件属性。

尝试更改图表的css属性:

 function downSize() {
            document.getElementById("chart1").style.height = "350px";
            document.getElementById("chart1").style.width = "600px";  
        }