从 asp.net c# 中的网页获取所有数据(包括图像）

Fetch all data (including image) from a webpage in asp.net c#

本文关键字：数据 包括 图像 获取 net asp 网页      更新时间：2023-09-26

我想知道我们是否可以使用 asp.net 从网页加载所有数据。就像我有一个包含表格和饼图的页面。我在单击按钮时将我的 html 内容导出为 pdf。我使用隐藏字段来获取要在服务器端转换的innerHTML数据。我正在获取数据，但问题是，当我导出到 pdf 时，饼图无处可见。C# 代码：

string htmlstring =  hiddenTest.Value;
 pdfConverter.SavePdfFromHtmlStringToFile(htmlstring, downloadName);

.HTML：

    function DrawPieChart(series) {
                $('#container').highcharts({
                    chart: {
                        plotBackgroundColor: null,
                        plotBorderWidth: 1, //null,
                        plotShadow: false,
                        backgroundColor: {
                            linearGradient: [50, 0, 100, 500],
                            stops: [
                        [0, 'rgb(255, 255, 255)'],
                        [1, 'rgb(0, 00, 0)']
                            ]
                        }
                    },
                    title: {
                        text: 'Matched and Unmatched Regions'
                    },
                    tooltip: {
                        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                    },
                    plotOptions: {
                        pie: {
                            allowPointSelect: true,
                            cursor: 'pointer',
                            dataLabels: {
                                enabled: true,
                                format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                                style: {
                                    color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                                }
                            }
                        }
                    },
                    series: [{
                        type: 'pie',
                        name: 'Percentage',
                        data: series
                    }]
                });


            }
            function htmlbind() {
                debugger;
                var d = document.getElementById('pdfdiv');
                var e = document.getElementById('hiddenTest');
                e.value = d.innerHTML;
            }

        </script>
        <%--<My:WebUserControl1 runat="server" ID="WebUserControl1" UserName="a" UserAge="45" UserCountry="Australia" />--%>
        <%--<asp:PlaceHolder runat="server" ID="phUserInfoBox" />--%>
    </head>
    <body bgcolor="#999999">
        <form id="form1" runat="server">
            <asp:Button ID="button" Text="click" runat="server" OnClick="b1_click" OnClientClick="htmlbind();"/>
            <asp:Button ID="button1" Text="click" runat="server" OnClick="b2_click" />
                <div>
                </div>
 <div id="pdfdiv" runat="server">
            <div id="container">
        </div>
        <br />
        <br />
            <asp:HiddenField ID="hfFilePath" runat="server" OnValueChanged="hfFilePath_ValueChanged" />
            <input type="hidden" runat="server" id="hiddenTest" />

JavaScript ：

function htmlbind() {
            debugger;
            var d = document.getElementById('pdfdiv');
            var e = document.getElementById('hiddenTest');
            e.value = d.innerHTML;
        }

希望得到建议。

你可以找到一个纯粹的HTML/Javascript示例，但它也适用于你的情况，并进行一些调整。

http://jsfiddle.net/lucasdamiani/skrhd982/16/（我不会把代码放在这里，因为有一堆HTML和Javascript）

您可以从脚本中使用此函数：

saveSvgAsPng(el, options)

el 是 SVG 元素，选项可以为空。

在此示例中，我获取由 highcharts 生成的图表并将其转换为纯 HTML，从而在数据 URI 中转换 SVG 图像。

有关将图形转换为 PNG 的详细逻辑，请参阅 http://spin.atomicobject.com/2014/01/21/convert-svg-to-png/。

相关文章：