Spire.PDF is a professional PDF library applied to creating, writing, editing, handling and reading PDF files without any external dependencies. Get free and professional technical support for Spire.PDF for .NET, Java, Android, C++, Python.

Wed Aug 15, 2018 6:24 pm

I have a small project which use the folowing code to create a PDF from a webpage but that webpage have some google chart javascript that needs to run before the pdf is created. however, even id i have the "enable javascript" at true, it doesn't wait for the javascript to execute



here is the sample code that create the pdf

Code: Select all
 HtmlConverter.Convert(ConfigurationManager.AppSettings["WebURL"] + "GenerateReport/PDF_GenerateTemplate.aspx?code=" + sGUID, ConfigurationManager.AppSettings["HTMLPath"] + testCandidateID + @"\" + sGUID + ".pdf",

               //enable javascript
               true,

               //load timeout
               100 * 1000,

               //page size
               new SizeF(612, 792),

               //page margins
               new PdfMargins(0, 0));


on the page that get called for the conversion, we have the folowing javascript code in the <head>

Code: Select all
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', {packages: ['corechart'], 'language' : 'fr'});
        google.charts.setOnLoadCallback(drawChart);

         function drawChart() {
      // Define the chart to be drawn.
             var data = new google.visualization.arrayToDataTable([
                 ["Element", "Density", { role: "style" }],
               
            ["comp1",3,"red" ],
 ["comp2",1,"red" ],
 ["comp3",2,"red" ],
 ["comp4",5,"red" ],
        ]);


            var view = new google.visualization.DataView(data);
            view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" },
                       2]);

           var options = {
              title: "",
            hAxis: {
                    viewWindowMode: 'explicit',
                    viewWindow: {min: 0,
                        max: 5}
                },
             
            width: 600,
            height: 400,
            bar: {groupWidth: "10%"},
            legend: { position: "none" },
      };


      // Instantiate and draw the chart.
        var chart_div = document.getElementById('barchart_values');
        var chart = new google.visualization.BarChart(chart_div);

            google.visualization.events.addListener(chart, 'ready', function () {
            chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
            console.log(chart_div.innerHTML);
          });
      chart.draw(view, options);
      //chart.draw(data, null);
        }
    </script>


this code does generate a chart and shot it in the page but it never runs before the pdf is compleated

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Thu Aug 16, 2018 9:41 am

Dear patrice,

Thanks for your inquiry.
I have noticed the issue you mentioned and posted it to our dev team for investigating and fixing. If there is any good news, we will let you know. Sorry for the inconvenience caused.

Sincerely,
Nina
E-iceblue support team
User avatar

Nina.Tang
 
Posts: 1385
Joined: Tue Sep 27, 2016 1:06 am

Thu Aug 16, 2018 6:24 pm

awesome, please let me know how i can fix this as soon as possible. our project have very short deadline

thanks

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Fri Aug 17, 2018 2:05 am

Hi patrice,

I got a feedback from our Dev team that the JavaScript in your html uses external JavaScript plugin, which is rather complicated. Sorry our Spire.Pdf can't deal with such JavaScript currently. Apologize for the inconvenience caused.

Sincerely,
Nina
E-iceblue support team
User avatar

Nina.Tang
 
Posts: 1385
Joined: Tue Sep 27, 2016 1:06 am

Fri Aug 17, 2018 12:16 pm

do you have any alternative?

any ways to tell the HTML convert to wait longer before doing the PDF or any other method that could be used for this? or maybe an other method that say convert the page i am currently on without "loading" it in stream

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Fri Aug 17, 2018 3:22 pm

ok so since nothing works with the Javascript, i decided to go with the asp:chart.


i'm using this in my front end

Code: Select all
<asp:Chart ID="Chart1" runat="server" Width="1000px">
                            <Series>
                                <asp:Series Name="Series1" ChartType="bar">
                                   
                                </asp:Series>
                            </Series>
                            <ChartAreas>
                                <asp:ChartArea Name="ChartArea1"></asp:ChartArea>
                            </ChartAreas>
                        </asp:Chart>


and this is my code in the back end

Code: Select all
Chart1.DataSource = dt5;
            Series series = Chart1.Series["Series1"];

            Chart1.Series["Series1"].XValueMember = "competenceName";
            Chart1.Series["Series1"].YValueMembers = "Score";
            //Chart1.Series["Series1"].CustomProperties = "PixelPointWidth=10";

            //a rendre dynamique le max
            Chart1.ChartAreas["ChartArea1"].AxisY.Maximum = 5;
            Chart1.ChartAreas["ChartArea1"].AxisY.Minimum = 0;

            Chart1.DataBind();

            int i = 0;

            foreach (DataRow dr in dt5.Rows)
            {
                Chart1.Series["Series1"].Points[i].Color = System.Drawing.ColorTranslator.FromHtml(dr["rateColor"].ToString());
                i++;
            }


basically, it populate the chart from my database. visually, the chart looks great in the html page (see image chart
chart html.png
). when i run the convert method (same as earlier), about 2-3 time out of 10, the chart is not visible in the result PDF (see chart
chart pdf ok.png
vs chart
chart pdf not ok.png
)

please let me know how to fix this, as this is done in code behind on page load the chart should be always visible before the PDF is done

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Fri Aug 17, 2018 8:24 pm

after further investigation, i found the issue happen when i run the HTML convert a second or third+ time. it does generate correctly when when, for example, i create a new build of my application and i run the code for the first time, but after that, it doesn't show the image chart as explained above until i do a new build again. is there something am i missing?

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Mon Aug 20, 2018 9:33 am

Dear patrice,

Thanks for your feedback and sorry for late reply as weekend.
Please try to increase the timeout in conversion method, such as 1000*1000. If it doesn't help, please provide a sample application that shows your issue to help us investigate your issue accurately.

Sincerely,
Nina
E-iceblue support team
User avatar

Nina.Tang
 
Posts: 1385
Joined: Tue Sep 27, 2016 1:06 am

Mon Aug 20, 2018 12:59 pm

I did try to set the timeout way higher and it doesnt change anything. The pdf is always created in a second or so, only thing is that the pdf contains the chart image only the first time the button is clicked, after that, it's not showing up anymore until i rerun the app

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Mon Aug 20, 2018 5:11 pm

Good morning,

i cant upload the sample, the sample project is 100mb and the forum only accept up to 2mb

please let me know how i can send this to you

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Tue Aug 21, 2018 2:11 am

Hi,

You could upload the sample project to your server, or upload it via OneDrive or DropBox and then share us with the link to download. You could send the link to us via email ([email protected]).

Sincerely,
Nina
E-iceblue support team
User avatar

Nina.Tang
 
Posts: 1385
Joined: Tue Sep 27, 2016 1:06 am

Tue Aug 21, 2018 12:50 pm

Good morning,

i just sent an email to the requested email address asked above containing the link to one drive

thanks

pharvey
 
Posts: 8
Joined: Wed Aug 15, 2018 6:17 pm

Wed Aug 22, 2018 8:10 am

Hello,

Thank your for providing detailed information.
After an initial investigation, we found that your issue is not related to our product, it is caused by the ASP.NET Page life cycle mechanism. In fact, when you clicking button the second time, the code of defining chart in Page_Load (in Contact.aspx.cs) is not really executed. To avoid the issue , please set page content in aspx page but not in Page_Load method.

Sincerely,
Nina
E-iceblue support team
User avatar

Nina.Tang
 
Posts: 1385
Joined: Tue Sep 27, 2016 1:06 am

Return to Spire.PDF