Question

我目前有一个包含Telerik组件的aspx页面，它将被渲染为SVG文件，基本上如果我在IE中启动页面并右键单击并保存，我可以将RadHtmlChart保存为svg。我想要做的是在代码隐藏中自动执行此操作并将该svg文件的字符串保存到变量中，以便它在内存中而不启动。这就是我现在所拥有的，但它不起作用。

Aspx代码（已编辑：）

               <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication3.WebForm1" %>

            <%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>

            <!DOCTYPE html>

            <html xmlns="http://www.w3.org/1999/xhtml">
            <head runat="server">
                <title></title>
            </head>
            <body>
                <form id="form1" runat="server">
                           <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                               <Scripts>
                                   <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js">
                                   </asp:ScriptReference>
                                   <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js">
                                   </asp:ScriptReference>
                                   <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js">
                                   </asp:ScriptReference>
                               </Scripts>
                           </telerik:RadScriptManager>
                           <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
                           </telerik:RadAjaxManager>
                           <telerik:RadHtmlChart runat="server" ID="RadHtmlChart1">
                                <Legend>
                                    <Appearance Position="Bottom">
                                        <TextStyle FontSize="14" Color="Blue" FontFamily="Courier New, sans-serif" />
                                    </Appearance>
                                </Legend>
                                <PlotArea>
                                    <XAxis>
                                        <Items>
                                            <telerik:AxisItem LabelText="KM41872"/>
                                            <telerik:AxisItem LabelText="KM41873"/>
                                            <telerik:AxisItem LabelText="KM41871"/>
                                        </Items>
                                        <MajorGridLines Visible="false" />
                                        <MinorGridLines Visible="false" />
                                    </XAxis>
                                    <YAxis>
                                        <MinorGridLines Visible="false" />
                                    </YAxis>
                                    <Series>
                                        <telerik:LineSeries Name="Mean">
                                            <SeriesItems>
                                                <telerik:CategorySeriesItem Y="0.59" />
                                                <telerik:CategorySeriesItem Y="0.63" />
                                                <telerik:CategorySeriesItem Y="0.6" />
                                                <telerik:CategorySeriesItem Y="0.65" />
                                                <telerik:CategorySeriesItem Y="0.64" />
                                                <telerik:CategorySeriesItem Y="0.63" />
                                                <telerik:CategorySeriesItem Y="0.65" />
                                                <telerik:CategorySeriesItem Y="0.67" />
                                                <telerik:CategorySeriesItem Y="0.63" />
                                            </SeriesItems>
                                        </telerik:LineSeries>
                                        <telerik:LineSeries Name="Min">
                                            <SeriesItems>
                                                <telerik:CategorySeriesItem Y="0.55" />
                                                <telerik:CategorySeriesItem Y="0.56" />
                                                <telerik:CategorySeriesItem Y="0.55" />
                                                <telerik:CategorySeriesItem Y="0.61" />
                                                <telerik:CategorySeriesItem Y="0.56" />
                                                <telerik:CategorySeriesItem Y="0.57" />
                                                <telerik:CategorySeriesItem Y="0.59" />
                                                <telerik:CategorySeriesItem Y="0.61" />
                                                <telerik:CategorySeriesItem Y="0.55" />
                                            </SeriesItems>
                                        </telerik:LineSeries>
                                        <telerik:LineSeries Name="Max">
                                            <SeriesItems>
                                                <telerik:CategorySeriesItem Y="0.66" />
                                                <telerik:CategorySeriesItem Y="0.74" />
                                                <telerik:CategorySeriesItem Y="0.66" />
                                                <telerik:CategorySeriesItem Y="0.71" />
                                                <telerik:CategorySeriesItem Y="0.72" />
                                                <telerik:CategorySeriesItem Y="0.73" />
                                                <telerik:CategorySeriesItem Y="0.71" />
                                                <telerik:CategorySeriesItem Y="0.74" />
                                                <telerik:CategorySeriesItem Y="0.71" />
                                            </SeriesItems>
                                        </telerik:LineSeries>
                                    </Series>
                                </PlotArea>
                            </telerik:RadHtmlChart>
                    <asp:HiddenField ID="hiddenVariable" runat="server" />
                </form>
            </body>
                <script>
                    var RadHtmlChart1 = $find('<%=RadHtmlChart1.ClientID %>');
                    var svg = RadHtmlChart1.getSVGString()
                    document.getElementById("hiddenVariable").value = svg;
                </script>
            </html>

代码隐藏代码：

Public Class WebForm1
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Dim html As String = hiddenVariable.Value.ToString
    End Sub

End Class

Answer 1

这将让你在客户端获得图表的svg。

<script>
    var RadHtmlChart1 = $find('<%=RadHtmlChart1.ClientID %>');
    var svg = RadHtmlChart1.getSVGString()

</script>

来源：http://www.telerik.com/help/aspnet-ajax/htmlchart-client-side-api.html

Answer 2

1）RadHtmlChart仅在浏览器中使用JavaScript呈现，因此要获得其SVG，您需要运行浏览器实例

2）JS代码执行得太早，查看Sys.Application.Load事件（http://msdn.microsoft.com/en-us/library/bb383829.aspx）或其pageLoad（）{}快捷方式。无法访问RadHtmlChart（以及其他此类控件）。

3）看看这个代码库条目，它使用单击按钮但逻辑应该类似：http://www.telerik.com/support/code-library/exporting-radhtmlchart-to-png-and-pdf。

4）考虑使用像PhantomJS这样的工具或类似工具，这样你就可以在服务器上运行浏览器并在那里获得所需的数据。自动化测试工具还可以通过在服务器上启动的浏览器中执行类似记录测试的操作来帮助您。

从aspx页面中提取svg元素的代码？

2 个答案: